@gravity-ui/app-builder 0.15.1-beta.4 → 0.15.1-beta.6

package/dist/common/models/index.d.ts

@@ -207,6 +207,11 @@ export interface ClientConfig {
         moduleType?: 'commonjs' | 'esm';
     };
     bundler?: Bundler;
+    /**
+     * Code loader. `babel` is default.
+     * `swc` is experimental and supported only in `rspack` bundler
+     */
+    codeLoader?: 'babel' | 'swc';
 }
 export interface CdnUploadConfig {
     bucket: string;

package/dist/common/webpack/config.js

@@ -40,12 +40,12 @@ const fork_ts_checker_webpack_plugin_1 = __importDefault(require("fork-ts-checke
 const mini_css_extract_plugin_1 = __importDefault(require("mini-css-extract-plugin"));
 const webpack_bundle_analyzer_1 = require("webpack-bundle-analyzer");
 const webpack_assets_manifest_1 = __importDefault(require("webpack-assets-manifest"));
+const rspack_manifest_plugin_1 = require("rspack-manifest-plugin");
 const react_refresh_webpack_plugin_1 = __importDefault(require("@pmmmwh/react-refresh-webpack-plugin"));
 const moment_timezone_data_webpack_plugin_1 = __importDefault(require("moment-timezone-data-webpack-plugin"));
 const webpack_plugin_1 = __importDefault(require("@statoscope/webpack-plugin"));
 const circular_dependency_plugin_1 = __importDefault(require("circular-dependency-plugin"));
 const core_1 = require("@rspack/core");
-const rspack_manifest_plugin_1 = require("rspack-manifest-plugin");
 const rspack_1 = require("./rspack");
 const ts_checker_rspack_plugin_1 = require("ts-checker-rspack-plugin");
 const plugin_react_refresh_1 = __importDefault(require("@rspack/plugin-react-refresh"));
@@ -370,6 +370,61 @@ function configureOutput(options) {
     };
 }
 function createJavaScriptLoader({ isEnvProduction, isEnvDevelopment, configType, config, isSsr, }) {
+    if (config.codeLoader === 'swc') {
+        if (config.bundler !== 'rspack') {
+            throw new Error('SWC is supported only with rspack bundler');
+        }
+        const browserslist = require('browserslist');
+        return {
+            loader: 'builtin:swc-loader',
+            options: {
+                sourceMaps: !config.disableSourceMapGeneration,
+                env: {
+                    loose: true,
+                    bugfixes: true,
+                    targets: browserslist(),
+                },
+                module: {
+                    type: 'es6',
+                    noInterop: true,
+                },
+                assumptions: {
+                    setPublicClassFields: true,
+                    privateFieldsAsProperties: true,
+                },
+                jsc: {
+                    parser: {
+                        syntax: 'typescript',
+                        tsx: true,
+                        decorators: true,
+                        dynamicImport: true,
+                    },
+                    transform: {
+                        react: {
+                            runtime: config.newJsxTransform ? 'automatic' : 'classic',
+                            development: isEnvDevelopment,
+                            refresh: !isSsr && isEnvDevelopment && config.reactRefresh !== false,
+                            useBuiltIns: true,
+                        },
+                    },
+                    experimental: {
+                        plugins: !isSsr && isEnvProduction
+                            ? [
+                                [
+                                    '@swc/plugin-transform-imports',
+                                    {
+                                        lodash: {
+                                            transform: 'lodash/{{member}}',
+                                        },
+                                    },
+                                ],
+                            ]
+                            : [],
+                    },
+                },
+            },
+        };
+    }
     const plugins = [];
     if (!isSsr) {
         if (isEnvDevelopment && config.reactRefresh !== false) {
@@ -492,7 +547,7 @@ function createStylesRule(options) {
 function getCssLoaders({ isEnvDevelopment, isEnvProduction, config, isSsr }, additionalRules) {
     const isRspack = config.bundler === 'rspack';
     const loaders = [];
-    if (!config.transformCssWithLightningCss) {
+    if (!config.transformCssWithLightningCss && config.bundler !== 'rspack') {
         loaders.push({
             loader: require.resolve('postcss-loader'),
             options: {
@@ -768,11 +823,24 @@ const commonBundlerPlugins = {
         rspack: progress_plugin_1.RspackProgressPlugin,
         webpack: progress_plugin_1.WebpackProgressPlugin,
     },
+    ManifestPlugin: {
+        rspack: rspack_manifest_plugin_1.RspackManifestPlugin,
+        webpack: webpack_manifest_plugin_1.WebpackManifestPlugin,
+    },
+    TsCheckerRspackPlugin: {
+        rspack: ts_checker_rspack_plugin_1.TsCheckerRspackPlugin,
+        webpack: fork_ts_checker_webpack_plugin_1.default,
+    },
+    CSSExtractPlugin: {
+        rspack: core_1.CssExtractRspackPlugin,
+        webpack: mini_css_extract_plugin_1.default,
+    },
 };
 function configureCommonPlugins(options) {
     const { isEnvDevelopment, isEnvProduction, config, isSsr } = options;
     const excludeFromClean = config.excludeFromClean || [];
     const bundler = config.bundler;
+    const forkTsCheckerOptions = getForkTsCheckerOptions(options);
     const plugins = [
         new clean_webpack_plugin_1.CleanWebpackPlugin({
             verbose: config.verbose,
@@ -782,10 +850,17 @@ function configureCommonPlugins(options) {
                 ...excludeFromClean,
             ],
         }),
+        new commonBundlerPlugins['ManifestPlugin'][bundler]({
+            writeToFileEmit: true,
+            publicPath: '',
+        }),
         new commonBundlerPlugins['DefinePlugin'][bundler](getDefinitions(options)),
         ...(options.logger
             ? [new commonBundlerPlugins['ProgressPlugin'][bundler]({ logger: options.logger })]
             : []),
+        ...(forkTsCheckerOptions
+            ? [new commonBundlerPlugins['TsCheckerRspackPlugin'][bundler](forkTsCheckerOptions)]
+            : []),
     ];
     if (config.detectCircularDependencies) {
         let circularPluginOptions = {
@@ -806,6 +881,9 @@ function configureCommonPlugins(options) {
             }));
         }
     }
+    if (isEnvProduction || isSsr || config.ssr) {
+        plugins.push(new commonBundlerPlugins['CSSExtractPlugin'][bundler](getCssExtractPluginOptions(options)));
+    }
     if (!isSsr) {
         const contextReplacements = getContextReplacements(options);
         contextReplacements.forEach(({ resourceRegExp, newResource }) => plugins.push(new commonBundlerPlugins['ContextReplacementPlugin'][bundler](resourceRegExp, newResource)));
@@ -851,13 +929,8 @@ function configureCommonPlugins(options) {
 }
 function configureWebpackPlugins(options) {
     const { isEnvDevelopment, isEnvProduction, config, isSsr } = options;
-    const forkTsCheckerOptions = getForkTsCheckerOptions(options);
     const webpackPlugins = [
         ...configureCommonPlugins(options),
-        new webpack_manifest_plugin_1.WebpackManifestPlugin({
-            writeToFileEmit: true,
-            publicPath: '',
-        }),
         new webpack_assets_manifest_1.default(isEnvProduction
             ? {
                 entrypoints: true,
@@ -869,11 +942,7 @@ function configureWebpackPlugins(options) {
                 output: path.resolve(options.buildDirectory, assetsManifestFile),
             }),
         ...(process.env.WEBPACK_PROFILE === 'true' ? [new webpack.debug.ProfilingPlugin()] : []),
-        ...(forkTsCheckerOptions ? [new fork_ts_checker_webpack_plugin_1.default(forkTsCheckerOptions)] : []),
     ];
-    if (isEnvProduction || isSsr || config.ssr) {
-        webpackPlugins.push(new mini_css_extract_plugin_1.default(getCssExtractPluginOptions(options)));
-    }
     if (isEnvProduction) {
         if (config.analyzeBundle === 'rsdoctor') {
             const { RsdoctorWebpackPlugin } = require('@rsdoctor/webpack-plugin');
@@ -894,23 +963,18 @@ function configureWebpackPlugins(options) {
 }
 function configureRspackPlugins(options) {
     const { isEnvDevelopment, isEnvProduction, config, isSsr } = options;
-    const forkTsCheckerOptions = getForkTsCheckerOptions(options);
     const rspackPlugins = [
         ...configureCommonPlugins(options),
         new rspack_manifest_plugin_1.RspackManifestPlugin({
             fileName: isEnvProduction
                 ? assetsManifestFile
-                : path.resolve(paths_1.default.appBuild, assetsManifestFile),
+                : path.resolve(options.buildDirectory, assetsManifestFile),
             writeToFileEmit: true,
             useLegacyEmit: true,
             publicPath: '',
             generate: rspack_1.generateAssetsManifest,
         }),
-        ...(forkTsCheckerOptions ? [new ts_checker_rspack_plugin_1.TsCheckerRspackPlugin(forkTsCheckerOptions)] : []),
     ];
-    if (isEnvProduction || isSsr || config.ssr) {
-        rspackPlugins.push(new core_1.CssExtractRspackPlugin(getCssExtractPluginOptions(options)));
-    }
     if (isEnvProduction) {
         if (config.analyzeBundle === 'rsdoctor') {
             const { RsdoctorRspackPlugin } = require('@rsdoctor/rspack-plugin');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/app-builder",
-  "version": "0.15.1-beta.4",
+  "version": "0.15.1-beta.6",
   "description": "Develop and build your React client-server projects, powered by typescript and webpack",
   "license": "MIT",
   "type": "commonjs",
@@ -79,6 +79,7 @@
     "@svgr/core": "^8.1.0",
     "@svgr/plugin-jsx": "^8.1.0",
     "@svgr/webpack": "^8.1.0",
+    "@swc/plugin-transform-imports": "^6.1.0",
     "babel-loader": "^9.2.1",
     "babel-plugin-import": "^1.13.8",
     "babel-plugin-inline-react-svg": "^2.0.2",