升级了几个npm包的版本之后发现css样式都没了,排查了半天才发现是css-loader新版本改动的问题。
问题版本:
vue-style-loader:4.1.0
css-loader:4.2.2
问题原因:
css-loader 4.0后默认对 esModule 设置的是true,而 vue-style-loader 4.1.0 默认接收的是 commonjs 的结果,也就是默认接收的是 “css-loader中 esModule 设置的是false的结果”,导致样式无法加载。
解决方案:
网上找到的办法是直接去改css-loader或者vue-style-loader的源码,具体见本文底部链接。在webpack官网找到css-loader有esModule参数的配置项,可以直接改
在webpack配置中将css-loader的esModule值改为false即可。
vueCli解决方案: