fix: production 关闭 concatenateModules 避免 MF 共享 chunk TDZ

README.md

@@ -348,7 +348,7 @@ const {CracoRemoteComponentsPlugin, CracoLibsExamplePlugin, env} = require('@kne
 
 #### CracoRemoteComponentsPlugin
 
-用于远程组件项目的 Craco 插件，自动配置文档解析、模块联邦和 CSS Modules 支持。
+用于远程组件项目的 Craco 插件，自动配置文档解析、模块联邦和 CSS Modules 支持。生产构建会关闭 webpack `concatenateModules`（scope hoisting），避免 Module Federation 与 ESM babel helpers / locale 拼进同一作用域时出现 `Cannot access ... before initialization`。开发态 `start` 不受影响。
 
 | 属性名 | 说明 | 类型 | 默认值 |
 |-----|----|----|-----|

doc/api.md

@@ -4,7 +4,7 @@ const {CracoRemoteComponentsPlugin, CracoLibsExamplePlugin, env} = require('@kne
 
 ### CracoRemoteComponentsPlugin
 
-用于远程组件项目的 Craco 插件，自动配置文档解析、模块联邦和 CSS Modules 支持。
+用于远程组件项目的 Craco 插件，自动配置文档解析、模块联邦和 CSS Modules 支持。生产构建会关闭 webpack `concatenateModules`（scope hoisting），避免 Module Federation 与 ESM babel helpers / locale 拼进同一作用域时出现 `Cannot access ... before initialization`。开发态 `start` 不受影响。
 
 | 属性名 | 说明 | 类型 | 默认值 |
 |-----|----|----|-----|

lib/craco-fix-plugin.js

@@ -3,6 +3,10 @@ const env = require("./env");
 module.exports = {
     overrideWebpackConfig({webpackConfig, context}) {
         if (context.env === 'production') {
+            // 关闭 scope hoisting：MF shared + ESM babel helpers/locale 被拼进同一作用域会 TDZ
+            webpackConfig.optimization = Object.assign({}, webpackConfig.optimization, {
+                concatenateModules: false
+            });
             when(context.env === 'production', () => {
                 // 查找 MiniCssExtractPlugin 实例
                 const miniCssExtractPlugin = webpackConfig.plugins.find(plugin => plugin.constructor && plugin.constructor.name === 'MiniCssExtractPlugin');
@@ -27,4 +31,4 @@ module.exports = {
         };
         return webpackConfig;
     }
-};
+};

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kne/modules-dev",
-  "version": "2.4.9",
+  "version": "2.4.10",
   "description": "用于辅助在项目内启动一个规范化组件开发的环境",
   "publishConfig": {
     "access": "public",

test/craco-fix-plugin.test.js

@@ -0,0 +1,22 @@
+const { expect } = require('chai');
+const plugin = require('../lib/craco-fix-plugin');
+
+const createConfig = (concatenateModules = true) => ({
+  plugins: [],
+  optimization: { concatenateModules },
+  resolve: {}
+});
+
+describe('craco-fix-plugin concatenateModules', () => {
+  it('production 应关闭 concatenateModules', () => {
+    const webpackConfig = createConfig(true);
+    plugin.overrideWebpackConfig({ webpackConfig, context: { env: 'production' } });
+    expect(webpackConfig.optimization.concatenateModules).to.equal(false);
+  });
+
+  it('development 不修改 concatenateModules', () => {
+    const webpackConfig = createConfig(true);
+    plugin.overrideWebpackConfig({ webpackConfig, context: { env: 'development' } });
+    expect(webpackConfig.optimization.concatenateModules).to.equal(true);
+  });
+});