React+TypeScript+Webpack 4多入口配置详解
React 多页面项目的配置一直让人头大，尤其还要配合 TypeScript 和 webpack 4 搞多入口？别慌，这篇文章就是来帮你理清楚的。整个流程从环境准备开始，到项目结构、webpack 多配置拆分、动态生成入口都讲得蛮细的，适合实战派开发者参考。
多入口的思路也挺实用，比如你有一个后台系统要拆分多个子模块，每个模块独立打包，那就用它的方式在src/category下建子目录，再用fs.readdirSync动态生成入口配置，响应也快，代码也清爽。
webpack 配置分三块：基础配置、开发配置和生产配置。每块职责都比较清晰，像开发环境就开启了HMR，写起来舒服；生产环境会加上chunkhash做缓存优化，还不错。
TypeScript 也没落下，ts-loader搞定编译，配合@types/react-dom啥的，类型提示齐全，踩坑少。哦对了，还有一点比较贴心，文章建议你先全局装typescript，不然tsc --init会出问题。
整个配置写法都挺偏实用型的，没有废话，也没有绕来绕去。如果你最近刚好要搞一个多人协作的 React 项目，或者后台系统需要拆模块分入口，这篇你值得一看。
文件大小：98.3KB
评论区