Node Sass could not find a binding for your current environment

typescript引入css直接报错:

具体错误如下：

ERROR in ./src/index.css (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/index.css)
Module Error (from ./node_modules/sass-loader/dist/cjs.js):
Missing binding C:\Users\tenrzzhang\Desktop\ten\reactapp\node_modules\node-sass\vendor\win32-x64-88\binding.node
Node Sass could not find a binding for your current environment: Windows 64-bit with Node.js 15.x

Found bindings for the following environments:
  - Windows 64-bit with Node.js 14.x

This usually happens because your environment has changed since running `npm install`.
Run `npm rebuild node-sass` to download the binding for your current environment.
 @ ./src/index.css 2:12-127 9:17-24 13:15-22
 @ ./src/index.tsx

ERROR in ./src/index.css (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/index.css)
Module build failed (from ./node_modules/css-loader/dist/cjs.js):
Error: PostCSS received undefined instead of CSS string
    at new Input (C:\Users\tenrzzhang\Desktop\ten\reactapp\node_modules\css-loader\node_modules\postcss\lib\input.js:22:13)
    at parse (C:\Users\tenrzzhang\Desktop\ten\reactapp\node_modules\css-loader\node_modules\postcss\lib\parse.js:8:15)
    at new LazyResult (C:\Users\tenrzzhang\Desktop\ten\reactapp\node_modules\css-loader\node_modules\postcss\lib\lazy-result.js:122:16)
    at Processor.process (C:\Users\tenrzzhang\Desktop\ten\reactapp\node_modules\css-loader\node_modules\postcss\lib\processor.js:33:12)
    at Object.loader (C:\Users\tenrzzhang\Desktop\ten\reactapp\node_modules\css-loader\dist\index.js:139:51)
 @ ./src/index.css 2:12-127 9:17-24 13:15-22
 @ ./src/index.tsx

检查webpack配置

{ test: /\.s?[ac]ss$/, use: [
        'style-loader',
        'css-loader',
        'sass-loader'
      ] },

模块 loader 可以链式调用。链中的每个 loader 都将对资源进行转换。链会逆序执行。第一个 loader 将其结果（被转换后的资源）传递给下一个 loader，依此类推。最后，webpack 期望链中的最后的 loader 返回 JavaScript。

应保证 loader 的先后顺序：'style-loader' 在前，而 'css-loader' 在后。如果不遵守此约定，webpack 可能会抛出错误。

我这里用到了sass-loader，按提示需要我执行命令更新sass-loader，但没有网络，所以我先去除了sass-loader。再运行，不报错了。

{
        test: /\.css$/i,
        use: ["style-loader", "css-loader"],
      },

Node Sass could not find a binding for your current environment

猜你喜欢