[Webpack]处理绑定Sass时发生的错误


环境

PHP 7.3.8
Laravel 6.18.40
webpack 4.27.1

TypeError:text.forEach不是函数...错误

在Docker开发环境下,我尝试使用npm run watch-poll进行构建,但是由于以下错误而失败。

1
2
3
4
5
ERROR in ./resources/scss/app.scss
Module build failed (from ./node_modules/css-loader/dist/cjs.js):
TypeError: text.forEach is not a function
    at /var/www/node_modules/extract-text-webpack-plugin/dist/loader.js:145:16
(略)

最后,我对使用了css-loadernode-sasssass-loaderstyle-loader,但这是每个版本的兼容性问题。

这次,通过将css-loader的版本从4.3降低而得到了改进。

1
2
npm uninstall --save-dev css-loader
npm install --save-dev [email protected]

最后,我通过以下配置确认了构建。

package.json

1
2
3
4
5
6
7
8
"css-loader": "^3.5.3",
"laravel-mix": "^4.0.7",
"lodash": "^4.17.13",
"node-sass": "^4.14.1",
"resolve-url-loader": "^2.3.1",
"sass": "^1.15.2",
"sass-loader": "^7.1.0",
"style-loader": "^1.2.1",

参考文章

?npm不可避免地会给出错误
当尝试在Laravel 6中使用Vue时,npm run watch时出现错误