公司的项目需要区分不同版本的后台管理系统,所以配置多个.env.xxx文件来打包。
一开始根据配置文件的后缀修改了相应NODE_ENV、ENV的值,但是打包后发现,production环境的打包代码是正常,其他环境是异常的。原因是除了production环境外,其他环境的webpack的splitChunks属性没生效,打包出来的代码没有分割chunk。但是vue.config.js里面的逻辑是除了development环境外,其他环境都执行splitChunks的。
后来排查了两天才发现是因为修改了NODE_ENV、ENV的值。只要将NODE_ENV、ENV改回production就可以了。
至于为什么会这样,还没搞明白。这里记录一下这个坑,希望遇到同样的问题的同行能得避开这个坑。也希望有知道原因的大神能不吝赐教,十分感谢!
公司项目配置信息:
其他环境的打包代码:
production环境的打包代码: