Webpack3升级Webpack4踩坑实录：成功经验与解决步骤

本文档主要讲述了作者在将一个基于webpack3的项目升级到webpack4时所遇到的问题和解决经验。升级webpack的过程中，作者首先提到了webpack4版本已经发布了一段时间，他之前尝试过升级但因某些原因未能完成，这次他决定再次挑战并成功地完成了升级过程。 在升级过程中，作者首先强调了webpack-cli的重要性，因为在webpack4中，它被作为一个单独的包分离开来。在升级时，需要确保先安装`webpack-cli`，无论是通过`npm install webpack-cli -D`还是`yarn add webpack-cli -D`。如果不安装，编译时会收到错误提示，指出需要配合webpack本身一起安装CLI。 接着，作者提到在升级后尝试运行开发环境时遇到了新的问题，具体是找不到`webpack/bin/config-yargs`模块。这个问题的出现可能是由于webpack-dev-server依赖的版本没有正确更新，或者与webpack4的结构变化有关。为了解决这个问题，可能需要检查项目的依赖树，确保所有相关的包都已适配webpack4，并可能需要更新webpack-dev-server的版本或重新配置其依赖。 作者没有提供具体的解决步骤，但读者可以推测这可能涉及到查看webpack-dev-server的文档，确认是否有针对webpack4的特定指南，或者根据错误信息搜索社区解决方案。此外，可能需要检查webpack.config.js文件，确保它与webpack4的配置规范相匹配，比如是否使用了新的命令或选项。 这篇文章提供了宝贵的实践经验和教训，对于那些计划升级webpack3到webpack4的开发者来说，可以帮助他们避免常见的陷阱，理解不同版本之间的差异以及如何处理迁移过程中的问题。通过阅读这篇文章，读者可以了解到如何适应新版工具链，如何正确配置依赖，并在遇到问题时如何排查和解决。