Webpack 构建 mini-css-extract-plugin sass-loader 报 Module build failed 错误

488 阅读1分钟

Webpack 构建过程中,mini-css-extract-plugin sass-loader 报 Module build failed 错误。 详细错误如下:

ERROR in ./src/scss/index.scss

Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):

ModuleError: Module Error (from ./node_modules/sass-loader/dist/cjs.js):

ENOENT: no such file or directory, scandir '/Users/test/node_modules/node-sass/vendor'

at Object.emitError (/Users/test/node_modules/webpack/lib/NormalModule.js:173:6)

at getSassImplementation (/Users/test/node_modules/sass-loader/dist/utils.js:60:21)

at Object.loader (/Users/test/node_modules/sass-loader/dist/index.js:35:59)

@ ./src/scripts/index.js 5:0-28

@ multi ./src/scripts/index.js

\


ERROR in ./src/scss/header.scss

Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):

ModuleError: Module Error (from ./node_modules/sass-loader/dist/cjs.js):

ENOENT: no such file or directory, scandir '/Users/test/node_modules/node-sass/vendor'

at Object.emitError (/Users/test/node_modules/webpack/lib/NormalModule.js:173:6)

at getSassImplementation (/Users/test/node_modules/sass-loader/dist/utils.js:60:21)

at Object.loader (/Users/test/node_modules/sass-loader/dist/index.js:35:59)

@ ./src/scripts/components/Header.js 63:0-29

@ ./src/scripts/router.js

@ ./src/scripts/index.js

@ multi ./src/scripts/index.js

\
\

Webpack config:

const MiniCssExtractPlugin = require('mini-css-extract-plugin');

plugins: [

    new MiniCssExtractPlugin({ // 抽离css为一个文件

    filename: "css/[name].css",

    chunkFilename: 'css/[name].css?v=[chunkhash:8]',

    }),
    ...
]

解决办法:

npm rebuild node-sass

执行结果:

Creating an optimized production build...

  Compiled successfully.