各位 webpack 大佬， 请问有没有办法手工加载 webpack 打包生成的 lazy chunk ？

2021-04-25 12:48:36 +08:00
 beginor

webpack 将项目打包成三个文件， 分别是：

其中主要功能都在按需加载的 lazy-chunk.js 里面。

index.html 文件中有直接引入了 runtime.js 和 main.js 

<body>
  <button type="button" id="loadApp">Load App</button>
  <button type="button" id="setParam">Set Param</button>
  <button type="button" id="destoryApp">Destroy App</button>
  <div id="app-container"></div>
  <script src="runtime.js" defer></script>
  <script src="main.js" defer></script>
</body>

点击 button#loadApp 会通过 main.js 来加载 lazy-chunk.js 并在 div#app-container 进行初始化。

想问的问题是，有没有办法跳过 main.js ， 直接加载 lazy-chunk.js 进行初始化？

1183 次点击
所在节点    前端开发
4 条回复
SoloCompany
2021-04-25 13:36:07 +08:00
不知道你的目的是什么, 如果是希望减少一个请求的话, 直接把 main.js inline 到 html 里面就好了 (但既然如此为和又要生成 runtime.js 而不是和 main.js 放一起)

如果目的是自动执行的话, 你不可以直接改 main.js 逻辑或者 src=main.js onload=loadApp.click() 吗?
beginor
2021-04-25 14:22:24 +08:00
@SoloCompany 是需要把 lazy-chunk.js 移植到另外的运行环境中， 这个环境不受自己控制， 同时这个项目的编译过程也不受自己控制
Mutoo
2021-04-25 14:35:56 +08:00
@beginor webpack 5 的 module federation 能够完成你的需求。最近在一个项目中使用了，非常不错。
beginor
2021-04-25 16:13:56 +08:00
@Mutoo 谢谢， 我去看一下

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/773092

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX