react+webpack4.x多模块打包配置

我们接着上一篇文章react+webpack4.x搭建前端项目（五）多页面配置 来进行配置模块的单独打包方式（下边简称多app打包） 多app打包的意思是：多个模块单独打包，模块之间的资源互相不依赖，某一模块的资源打包在该模块下。这是和多页面最不大的不同，打包资源再多页面之间其实是公用的，bundle包资源也具有相互依赖的特征 先捋一下实现的思路，（基于上一篇react+webpack4.x多页面配置release-tag-0.0.3代码） 多app打包基于node的child_process模块创建子进程，在这个子进程执行打包任务，这样我们可以创建多个子进程执行打包任务，也就可以打包出多app 子进程执行打包命令的时候，注入参数区分是多app打包还是多页面打包 针对参数，动态生成webpack配置，进行不同方式打包 这里不具体讲述修改的代码细节了，值只贴一下关键代码。 详细代码请查看 react+webpack4.x多模块打包配置release-tag-0.0.4 新建build/build-apps.js多app打包脚本 使用child_process的child_process.execFileSync方法创建子进程执行打包任务 详细使用教程请看官方文档child_process使用文档 const child_process = require("child_process"); const { getModuleList } = require("./module-entry"); const path = require("path") const filePath = path.resolve(__dirname,"./build.js") const fs = require("fs") // 支持自定是模块打包 const modules = process.argv[2]; if(modules){ const moduleList = modules.split(",") // 动态遍历每个模块，对每个模块开启子进程单独进行打包 for(let index=0;index本文章由javascript技术分享原创和收集