webpack-4 引用组件的项目，启动后提示不能再入口文件中使用

排查了一下是webpack的entry文件中有引用，为什么会有这样的限制，怎么避开？

Sep 07 '23 06:09 yychengyy

https://webpack.js.org/concepts/module-federation/#troubleshooting 此限制与webpack5的限制一致, 在入口使用远程模块时候需要新开异步chunk, 来实现等待远程模块的加载, 这一步体现在 import("./bootstrap")

如果你不清楚如何修改可以贴一下entry代码我来修改

Sep 07 '23 07:09 zhangHongEn

可以给个示例吗？我的代码太长，是业务逻辑，总得来说，我的业务需求是必须在entry设置的js文件里引入远程模块的js处理业务

Sep 07 '23 08:09 yychengyy

entry：{ app: 'a.js' } a.js impot service from service/main'; // 引用远程模块类似这样

Sep 07 '23 08:09 yychengyy

简单的说就是把a.js的内容复制到bootstrap.js中去

entry：{
app: 'a.js'
}

// a.js
import("./bootstrap.js")

// bootstrap.js
impot service from service/main'; // 引用远程模块

Sep 07 '23 08:09 zhangHongEn

为什么这样就可以避开限制，执行结果不也相当于引入远程模块吗？

Sep 07 '23 08:09 yychengyy

entry a.js作为入口会被任意其他项目用各种方式（如script、fetch、systemjs等）引入, 它的加载方式不受webpack干涉, 所以无法等待远程模块的加载。 import("./bootstrap")会进行代码分割, 拆分出 bootstrapChunk.hash.js, webpack加载这个chunk时MF会处理远程模块的加载与等待

Sep 07 '23 09:09 zhangHongEn

我讲a.js的内容全部移动到bootstrap.js，然后执行，又提示变量不存在，是不是应该有什么特殊设置？大佬，方便加个微信或者其他的联络方式吗？指导一下我MF速成

Sep 07 '23 09:09 yychengyy