Create React App（CRA）是否适合用于生产环境？

1. CRA是否可用于生产环境？ #

当然可以。CRA（Create React App）官方本身就提供成熟的生产构建能力，执行npm run build后会生成经过代码压缩、Tree Shaking、资源哈希化的优化产物，体积远小于你本地开发环境的node_modules和缓存文件。你遇到的25GB是开发环境的本地依赖+缓存数据，不是生产部署的最终产物——生产构建后的静态文件通常只有几MB到几十MB，完全符合生产环境的部署要求。

很多中小项目甚至部分中型项目都在生产环境使用CRA，它的封装能帮你省去大量Webpack/Babel的配置成本，专注于业务开发。

2. CRA vs Babel/Webpack：哪个更好？ #

二者不是对立关系——CRA本身就是基于Webpack和Babel封装的开箱即用工具。

• 如果你的项目是常规React应用，没有特殊的构建定制需求（比如多入口打包、复杂的资源处理规则、自定义代码分割策略），CRA的封装完全够用，没必要手动配置Webpack+Babel，反而会增加维护成本。
• 如果你需要高度定制化的构建流程（比如集成非标准的工具链、优化特定场景的打包体积），那直接手动配置Webpack+Babel会更灵活，能完全掌控构建的每一个环节。

3. 开发用CRA，生产换Webpack+Babel是否可行？ #

理论上可行，但完全没必要，还会带来额外风险：

• 两套构建环境容易出现规则不一致的问题（比如语法转换、代码分割逻辑不同），导致开发环境正常的代码到生产环境出现bug，排查难度极大。
• CRA的生产构建已经做了足够多的优化，如果你觉得本地开发的node_modules体积过大，可以通过这些方式优化：
  • 使用pnpm/yarn这类更高效的包管理器，减少依赖重复存储
  • 执行npm run clean清理CRA的本地缓存
  • 用npm ci替代npm install，确保依赖版本一致且无冗余
• 真要定制CRA的构建规则，更高效的方式是用react-app-rewired或craco这类工具扩展配置，或者执行npm run eject暴露底层Webpack/Babel配置进行修改，比重新搭建一套构建流程成本低得多。

内容的提问来源于stack exchange，提问作者jolthedev