@gravity-ui/app-builder 0.14.1 → 0.15.0

package/dist/commands/build/build-service/client.js

@@ -3,5 +3,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.buildClient = buildClient;
 const compile_1 = require("../../../common/webpack/compile");
 function buildClient(config) {
-    return (0, compile_1.webpackCompile)(config.client);
+    return (0, compile_1.clientCompile)(config.client);
 }

package/dist/commands/dev/client.js

@@ -38,13 +38,13 @@ const paths_1 = __importDefault(require("../../common/paths"));
 const logger_1 = require("../../common/logger");
 const config_1 = require("../../common/webpack/config");
 async function watchClientCompilation(config, onManifestReady) {
-    const clientCompilation = await buildWebpackServer(config);
+    const clientCompilation = await buildDevServer(config);
     const compiler = clientCompilation.compiler;
     subscribeToManifestReadyEvent(compiler, onManifestReady);
     return clientCompilation;
 }
-async function buildWebpackServer(config) {
-    const logger = new logger_1.Logger('webpack', config.verbose);
+async function buildDevServer(config) {
+    const logger = new logger_1.Logger('client', config.verbose);
     const { webSocketPath = path.normalize(`/${config.client.publicPathPrefix}/build/sockjs-node`), writeToDisk, ...devServer } = config.client.devServer || {};
     const normalizedConfig = { ...config.client, devServer: { ...devServer, webSocketPath } };
     const webpackConfigs = [
@@ -52,8 +52,11 @@ async function buildWebpackServer(config) {
     ];
     const isSsr = Boolean(normalizedConfig.ssr);
     if (isSsr) {
-        const logger = new logger_1.Logger('webpack(SSR)', config.verbose);
-        webpackConfigs.push(await (0, config_1.webpackConfigFactory)("development" /* WebpackMode.Dev */, normalizedConfig, { logger, isSsr }));
+        const ssrLogger = new logger_1.Logger('client(SSR)', config.verbose);
+        webpackConfigs.push(await (0, config_1.webpackConfigFactory)("development" /* WebpackMode.Dev */, normalizedConfig, {
+            logger: ssrLogger,
+            isSsr,
+        }));
     }
     const publicPath = path.normalize(config.client.publicPathPrefix + '/build/');
     const staticFolder = path.resolve(paths_1.default.appDist, 'public');

package/dist/common/config.js

@@ -22,15 +22,10 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getProjectConfig = getProjectConfig;
 exports.normalizeConfig = normalizeConfig;
-/* eslint-disable complexity */
 const path = __importStar(require("node:path"));
-const lodash_1 = __importDefault(require("lodash"));
 const cosmiconfig_1 = require("cosmiconfig");
 const cosmiconfig_typescript_loader_1 = require("cosmiconfig-typescript-loader");
 const models_1 = require("./models");
@@ -42,7 +37,13 @@ function remapPaths(paths) {
     return splitPaths(paths).map((p) => path.resolve(process.cwd(), p));
 }
 function omitUndefined(obj) {
-    return lodash_1.default.omitBy(obj, lodash_1.default.isUndefined);
+    const newObj = {};
+    for (const [key, value] of Object.entries(obj)) {
+        if (value !== undefined) {
+            newObj[key] = value;
+        }
+    }
+    return newObj;
 }
 function getModuleLoader({ storybook } = {}) {
     if (!storybook) {
@@ -176,7 +177,7 @@ async function normalizeConfig(userConfig, mode) {
         };
         return config;
     }
-    const config = lodash_1.default.cloneDeep(userConfig);
+    const config = structuredClone(userConfig);
     config.lib.newJsxTransform = config.lib.newJsxTransform ?? true;
     return config;
 }

package/dist/common/s3-upload/webpack-plugin.d.ts

@@ -1,4 +1,4 @@
-import type { Compiler } from 'webpack';
+import type * as Webpack from 'webpack';
 import type { Logger } from '../logger/index.js';
 import type { UploadOptions } from './upload.js';
 import type { S3ClientOptions } from './s3-client.js';
@@ -14,7 +14,7 @@ interface S3UploadPluginOptions {
 export declare class S3UploadPlugin {
     private options;
     constructor(options: S3UploadPluginOptions);
-    apply(compiler: Compiler): void;
+    apply(compiler: Webpack.Compiler): void;
     private isIncludeAndNotExclude;
 }
 type Rule = RegExp | string | ((s: string) => boolean);

package/dist/common/s3-upload/webpack-plugin.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.S3UploadPlugin = void 0;
-const webpack_1 = require("webpack");
 const fast_glob_1 = require("fast-glob");
 const upload_js_1 = require("./upload.js");
 class S3UploadPlugin {
@@ -12,7 +11,7 @@ class S3UploadPlugin {
     apply(compiler) {
         compiler.hooks.done.tapPromise('s3-upload-plugin', async (stats) => {
             if (stats.hasErrors()) {
-                stats.compilation.warnings.push(new webpack_1.WebpackError('s3-upload-plugin: skipped upload to s3 due to compilation errors'));
+                stats.compilation.warnings.push(new compiler.webpack.WebpackError('s3-upload-plugin: skipped upload to s3 due to compilation errors'));
                 return;
             }
             let fileNames = Object.keys(stats.compilation.assets);
@@ -39,7 +38,7 @@ class S3UploadPlugin {
                 this.options.logger?.success(`Files successfully uploaded to bucket ${this.options.s3UploadOptions.bucket}`);
             }
             catch (e) {
-                const error = new webpack_1.WebpackError(`s3-upload-plugin: ${e instanceof Error ? e.message : e}`);
+                const error = new compiler.webpack.WebpackError(`s3-upload-plugin: ${e instanceof Error ? e.message : e}`);
                 stats.compilation.errors.push(error);
             }
         });

package/dist/common/typescript/compile.js

@@ -24,7 +24,7 @@ function compile(ts, { projectPath, configFileName = 'tsconfig.json', optionsToE
     const program = ts.createProgram(parsedConfig.fileNames, parsedConfig.options, compilerHost);
     // @ts-expect-error
     const filesCount = compilerHost.readFile.disableDisplay();
-    const allDiagnostics = ts.getPreEmitDiagnostics(program).slice();
+    let allDiagnostics = ts.getPreEmitDiagnostics(program);
     logger.verbose(`Program created, read ${filesCount} files`);
     if (!hasErrors(allDiagnostics)) {
         logger.verbose('We finished making the program! Emitting...');
@@ -34,7 +34,7 @@ function compile(ts, { projectPath, configFileName = 'tsconfig.json', optionsToE
             afterDeclarations: [transformPathsToLocalModules],
         });
         logger.verbose('Emit complete!');
-        allDiagnostics.push(...emitResult.diagnostics);
+        allDiagnostics = ts.sortAndDeduplicateDiagnostics(allDiagnostics.concat(emitResult.diagnostics));
     }
     allDiagnostics.forEach(reportDiagnostic);
     if (hasErrors(allDiagnostics)) {
@@ -44,12 +44,12 @@ function compile(ts, { projectPath, configFileName = 'tsconfig.json', optionsToE
     else {
         logger.success(`Compiled successfully in ${(0, pretty_time_1.elapsedTime)(start)}`);
     }
-    const formatHost = {
-        getCanonicalFileName: (path) => path,
-        getCurrentDirectory: ts.sys.getCurrentDirectory,
-        getNewLine: () => ts.sys.newLine,
-    };
     function reportDiagnostic(diagnostic) {
+        const formatHost = {
+            getCanonicalFileName: (path) => path,
+            getCurrentDirectory: ts.sys.getCurrentDirectory,
+            getNewLine: () => ts.sys.newLine,
+        };
         if (logger.isVerbose) {
             logger.message(ts.formatDiagnosticsWithColorAndContext([diagnostic], formatHost));
         }

package/dist/common/typescript/watch.js

@@ -9,11 +9,6 @@ function watch(ts, projectPath, { logger, onAfterFilesEmitted, enableSourceMap,
     logger.message(`Typescript v${ts.version}`);
     const configPath = (0, utils_1.getTsProjectConfigPath)(ts, projectPath);
     const createProgram = ts.createEmitAndSemanticDiagnosticsBuilderProgram;
-    const formatHost = {
-        getCanonicalFileName: (path) => path,
-        getCurrentDirectory: ts.sys.getCurrentDirectory,
-        getNewLine: () => ts.sys.newLine,
-    };
     const host = ts.createWatchCompilerHost(configPath, {
         noEmit: false,
         noEmitOnError: false,
@@ -46,6 +41,11 @@ function watch(ts, projectPath, { logger, onAfterFilesEmitted, enableSourceMap,
     // the program over time.
     ts.createWatchProgram(host);
     function reportDiagnostic(diagnostic) {
+        const formatHost = {
+            getCanonicalFileName: (path) => path,
+            getCurrentDirectory: ts.sys.getCurrentDirectory,
+            getNewLine: () => ts.sys.newLine,
+        };
         if (logger.isVerbose) {
             logger.message(ts.formatDiagnosticsWithColorAndContext([diagnostic], formatHost));
         }
@@ -59,7 +59,7 @@ function watch(ts, projectPath, { logger, onAfterFilesEmitted, enableSourceMap,
      */
     function reportWatchStatusChanged(diagnostic) {
         if (diagnostic.messageText) {
-            logger.message(ts.flattenDiagnosticMessageText(diagnostic.messageText, formatHost.getNewLine()));
+            logger.message(ts.flattenDiagnosticMessageText(diagnostic.messageText, ts.sys.newLine));
         }
     }
 }

package/dist/common/webpack/compile.d.ts

@@ -1,2 +1,2 @@
 import type { NormalizedClientConfig } from '../models';
-export declare function webpackCompile(config: NormalizedClientConfig): Promise<void>;
+export declare function clientCompile(config: NormalizedClientConfig): Promise<void>;

package/dist/common/webpack/compile.js

@@ -3,18 +3,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.webpackCompile = webpackCompile;
+exports.clientCompile = clientCompile;
 const webpack_1 = __importDefault(require("webpack"));
 const logger_1 = require("../logger");
 const config_1 = require("./config");
 const utils_1 = require("./utils");
-async function webpackCompile(config) {
-    const logger = new logger_1.Logger('webpack', config.verbose);
+async function clientCompile(config) {
+    const logger = new logger_1.Logger('client', config.verbose);
     const webpackConfigs = [await (0, config_1.webpackConfigFactory)("production" /* WebpackMode.Prod */, config, { logger })];
     const isSsr = Boolean(config.ssr);
     if (isSsr) {
-        const logger = new logger_1.Logger('webpack(SSR)', config.verbose);
-        webpackConfigs.push(await (0, config_1.webpackConfigFactory)("production" /* WebpackMode.Prod */, config, { logger, isSsr }));
+        const ssrLogger = new logger_1.Logger('client(SSR)', config.verbose);
+        webpackConfigs.push(await (0, config_1.webpackConfigFactory)("production" /* WebpackMode.Prod */, config, { logger: ssrLogger, isSsr }));
     }
     logger.verbose('Config created');
     return new Promise((resolve) => {

package/dist/common/webpack/config.js

@@ -30,7 +30,6 @@ exports.webpackConfigFactory = webpackConfigFactory;
 exports.configureModuleRules = configureModuleRules;
 exports.configureResolve = configureResolve;
 exports.configureOptimization = configureOptimization;
-/* eslint-disable complexity */
 const path = __importStar(require("node:path"));
 const fs = __importStar(require("node:fs"));
 const webpack = __importStar(require("webpack"));

package/dist/common/webpack/node-externals.d.ts

@@ -1,8 +1,10 @@
-import type * as webpack from 'webpack';
 type Pattern = RegExp | ((v: string) => boolean) | string;
 export interface NodeExternalsOptions {
     noExternal?: Pattern | Pattern[];
     module?: boolean;
 }
-export declare function nodeExternals({ noExternal, module }: NodeExternalsOptions): (data: webpack.ExternalItemFunctionData) => Promise<string | undefined>;
+export declare function nodeExternals({ noExternal, module }: NodeExternalsOptions): (data: {
+    request?: string;
+    dependencyType?: string;
+}) => Promise<string | undefined>;
 export {};

package/dist/common/webpack/node-externals.js

@@ -35,7 +35,7 @@ function nodeExternals({ noExternal = [], module }) {
     const noExternals = Array().concat(webpackInternal).concat(noExternal);
     const nodeModules = readPackagesNames(paths_1.default.appNodeModules);
     return async (data) => {
-        const { request } = data;
+        const { request, dependencyType } = data;
         if (!request) {
             return undefined;
         }
@@ -46,14 +46,14 @@ function nodeExternals({ noExternal = [], module }) {
             return undefined;
         }
         if (!module) {
-            return `commonjs ${data.request}`;
+            return `commonjs ${request}`;
         }
-        if (data.dependencyType === 'commonjs' ||
+        if (dependencyType === 'commonjs' ||
             // lodash/something without extension can't be imported so always require it
             (moduleName === 'lodash' && request.match(/^lodash\/[\w_]+($|\/[\w_]+$)/))) {
-            return `node-commonjs ${data.request}`;
+            return `node-commonjs ${request}`;
         }
-        return `module-import ${data.request}`;
+        return `module-import ${request}`;
     };
 }
 function readPackagesNames(dirName) {

package/dist/common/webpack/progress-plugin.d.ts

@@ -1,4 +1,5 @@
-import * as webpack from 'webpack';
+import webpack from 'webpack';
+import type * as Webpack from 'webpack';
 import type { Logger } from '../logger';
 export declare class ProgressPlugin extends webpack.ProgressPlugin {
     private _logger;
@@ -7,5 +8,5 @@ export declare class ProgressPlugin extends webpack.ProgressPlugin {
         logger: Logger;
     });
     handler: (percent: number, message: string, ...details: string[]) => void;
-    apply(compiler: webpack.Compiler): void;
+    apply(compiler: Webpack.Compiler): void;
 }

package/dist/common/webpack/progress-plugin.js

@@ -1,32 +1,12 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ProgressPlugin = void 0;
-const webpack = __importStar(require("webpack"));
+const webpack_1 = __importDefault(require("webpack"));
 const pretty_time_1 = require("../logger/pretty-time");
-class ProgressPlugin extends webpack.ProgressPlugin {
+class ProgressPlugin extends webpack_1.default.ProgressPlugin {
     _logger;
     _state = {};
     constructor({ logger }) {
@@ -41,7 +21,12 @@ class ProgressPlugin extends webpack.ProgressPlugin {
         super.apply(compiler);
         hook(compiler, 'compile', () => {
             this._logger.message('Start compilation');
-            this._logger.message(`Webpack v${compiler.webpack.version}`);
+            if ('rspackVersion' in compiler.webpack) {
+                this._logger.message(`Rspack v${compiler.webpack.rspackVersion}`);
+            }
+            else {
+                this._logger.message(`Webpack v${compiler.webpack.version}`);
+            }
             this._state.start = process.hrtime.bigint();
         });
         hook(compiler, 'invalid', (fileName, changeTime) => {

package/dist/common/webpack/utils.d.ts

@@ -1,6 +1,6 @@
-import type webpack from 'webpack';
+import type * as Webpack from 'webpack';
 import type { Logger } from '../logger';
-export declare function webpackCompilerHandlerFactory(logger: Logger, onCompilationEnd?: () => void): (err?: Error | null, stats?: webpack.MultiStats) => Promise<void>;
+export declare function webpackCompilerHandlerFactory(logger: Logger, onCompilationEnd?: () => void): (err?: Error | null, stats?: Webpack.MultiStats) => Promise<void>;
 export declare function resolveTsConfigPathsToAlias(projectPath: string, filename?: string): {
     aliases?: undefined;
     modules?: undefined;

package/dist/common/webpack/utils.js

@@ -53,11 +53,13 @@ function webpackCompilerHandlerFactory(logger, onCompilationEnd) {
         }
         const [clientStats, ssrStats] = stats?.stats ?? [];
         if (clientStats) {
-            const time = clientStats.endTime - clientStats.startTime;
+            const { startTime = 0, endTime = 0 } = clientStats;
+            const time = endTime - startTime;
             logger.success(`Client was successfully compiled in ${(0, pretty_time_1.prettyTime)(BigInt(time) * BigInt(1_000_000))}`);
         }
         if (ssrStats) {
-            const time = ssrStats.endTime - ssrStats.startTime;
+            const { startTime = 0, endTime = 0 } = ssrStats;
+            const time = endTime - startTime;
             logger.success(`SSR: Client was successfully compiled in ${(0, pretty_time_1.prettyTime)(BigInt(time) * BigInt(1_000_000))}`);
         }
         if (!clientStats && !ssrStats) {

package/dist/common/webpack/worker/worker-loader.d.ts

@@ -1,2 +1,2 @@
-import webpack from 'webpack';
-export declare const pitch: webpack.PitchLoaderDefinitionFunction;
+import type * as Webpack from 'webpack';
+export declare const pitch: Webpack.PitchLoaderDefinitionFunction;

package/dist/common/webpack/worker/worker-loader.js

@@ -28,11 +28,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.pitch = void 0;
 const path = __importStar(require("node:path"));
-const webpack_1 = __importDefault(require("webpack"));
-const NodeTargetPlugin_1 = __importDefault(require("webpack/lib/node/NodeTargetPlugin"));
-const WebWorkerTemplatePlugin_1 = __importDefault(require("webpack/lib/webworker/WebWorkerTemplatePlugin"));
-const FetchCompileWasmPlugin_1 = __importDefault(require("webpack/lib/web/FetchCompileWasmPlugin"));
-const FetchCompileAsyncWasmPlugin_1 = __importDefault(require("webpack/lib/web/FetchCompileAsyncWasmPlugin"));
 const paths_1 = __importDefault(require("../../paths"));
 const pluginId = 'APP_BUILDER_WORKER_LOADER';
 const publicPath = path.resolve(__dirname, 'public-path.worker.js');
@@ -41,7 +36,7 @@ const pitch = function (request) {
     if (!this._compiler || !this._compilation) {
         throw new Error('Something went wrong');
     }
-    const compilerOptions = this._compiler.options;
+    const { options: compilerOptions, webpack } = this._compiler;
     const logger = this.getLogger(pluginId);
     if (compilerOptions.output.globalObject === 'window') {
         logger.warn('Warning (app-builder-worker-loader): output.globalObject is set to "window". It should be set to "self" or "this" to support HMR in Workers.');
@@ -59,17 +54,22 @@ const pitch = function (request) {
         devtoolNamespace: path.resolve('/', path.relative(paths_1.default.app, this.resource)),
     };
     const workerCompiler = this._compilation.createChildCompiler(`worker ${request}`, workerOptions);
-    new WebWorkerTemplatePlugin_1.default().apply(workerCompiler);
+    const { EntryPlugin, node: { NodeTargetPlugin }, web: { FetchCompileWasmPlugin, FetchCompileAsyncWasmPlugin }, webworker: { WebWorkerTemplatePlugin }, } = webpack;
+    new WebWorkerTemplatePlugin().apply(workerCompiler);
     if (this.target !== 'webworker' && this.target !== 'web') {
-        new NodeTargetPlugin_1.default().apply(workerCompiler);
+        new NodeTargetPlugin().apply(workerCompiler);
+    }
+    if (FetchCompileWasmPlugin) {
+        new FetchCompileWasmPlugin({
+            mangleImports: this._compiler.options.optimization.mangleWasmImports,
+        }).apply(workerCompiler);
+    }
+    if (FetchCompileAsyncWasmPlugin) {
+        new FetchCompileAsyncWasmPlugin().apply(workerCompiler);
     }
-    new FetchCompileWasmPlugin_1.default({
-        mangleImports: this._compiler.options.optimization.mangleWasmImports,
-    }).apply(workerCompiler);
-    new FetchCompileAsyncWasmPlugin_1.default().apply(workerCompiler);
     const bundleName = path.parse(this.resourcePath).name;
-    new webpack_1.default.EntryPlugin(this.context, `!!${publicPath}`, bundleName).apply(workerCompiler);
-    new webpack_1.default.EntryPlugin(this.context, `!!${request}`, bundleName).apply(workerCompiler);
+    new EntryPlugin(this.context, `!!${publicPath}`, bundleName).apply(workerCompiler);
+    new EntryPlugin(this.context, `!!${request}`, bundleName).apply(workerCompiler);
     configureSourceMap(workerCompiler);
     const cb = this.async();
     workerCompiler.compile((err, compilation) => {
@@ -130,10 +130,10 @@ const pitch = function (request) {
                     if ([filename, mapFile, licenseFile].includes(assetName)) {
                         continue;
                     }
-                    if (parentCompilation.assetsInfo.has(assetName)) {
+                    if (parentCompilation.getAsset(assetName)) {
                         continue;
                     }
-                    parentCompilation.emitAsset(assetName, asset, compilation.assetsInfo.get(assetName));
+                    parentCompilation.emitAsset(assetName, asset, compilation.getAsset(assetName)?.info);
                 }
             }
             return cache.store(cacheIdent, cacheETag, { content, map: map?.toString() }, (storeCacheError) => {
@@ -163,7 +163,7 @@ function configureSourceMap(compiler) {
             const inline = devtool.includes('inline');
             const cheap = devtool.includes('cheap');
             const moduleMaps = devtool.includes('module');
-            new webpack_1.default.SourceMapDevToolPlugin({
+            new compiler.webpack.SourceMapDevToolPlugin({
                 filename: inline ? null : compiler.options.output.sourceMapFilename,
                 moduleFilenameTemplate: compiler.options.output.devtoolModuleFilenameTemplate,
                 fallbackModuleFilenameTemplate: compiler.options.output.devtoolFallbackModuleFilenameTemplate,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/app-builder",
-  "version": "0.14.1",
+  "version": "0.15.0",
   "description": "Develop and build your React client-server projects, powered by typescript and webpack",
   "license": "MIT",
   "type": "commonjs",
@@ -95,7 +95,6 @@
     "fork-ts-checker-webpack-plugin": "^9.0.2",
     "fs-extra": "^11.2.0",
     "get-port": "^7.1.0",
-    "lodash": "^4.17.21",
     "mime-types": "^2.1.35",
     "mini-css-extract-plugin": "^2.9.1",
     "moment-timezone-data-webpack-plugin": "^1.5.1",
@@ -143,7 +142,6 @@
     "@types/common-tags": "^1.8.4",
     "@types/fs-extra": "^11.0.4",
     "@types/jest": "^29.5.2",
-    "@types/lodash": "^4.17.10",
     "@types/mime-types": "^2.1.4",
     "@types/node": "^18",
     "@types/nodemon": "^1.19.6",