无法编译 Node-sass 不工作错误答案

【问题标题】：Failed to compile Node-sass not working error无法编译 Node-sass 不工作错误
【发布时间】：2021-04-19 15:57:37
【问题描述】：

我正在尝试运行一个已经制作好的 react.js 项目。

我已经安装了npm install。

但我每次都面临错误。

./src/assets/base.scss (./node_modules/react-scripts/node_modules/css-loader/dist/cjs.js??ref--5-oneOf-6-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--5-oneOf-6-3!./node_modules/sass-loader/dist/cjs.js??ref--5-oneOf-6-4!./src/assets/base.scss) Error: Can't resolve './components/icons/components/icons/linearicons/Linearicons-Free.eot' in '/home/arsalan/Desktop/libra/FrontEnd-main/src/assets'

我已经做了研究，已经做了以下解决方案。

卸载并重新安装 node-sass

  npm uninstall node-sass;

  npm install node-sass@4.14.1

来自此 URL [与我的错误相关的堆栈溢出 URL][1]

node-sass 的重建
```
  npm rebuild node-sass
```

删除 node_module 并重新安装它

 remove node_modules folder and run npm install

来自此 URL [与我的错误相关的堆栈溢出 URL][2]

还尝试了以下方法。

npm install --save node-sass

但这些都不适合我。谁能指导我哪里错了？

【问题讨论】：

你能看看我的回答，如果它解决了你的问题，请告诉我？
@robertp 不，这对我没有帮助。
好的。你是否安装了 npm 包，或者刚刚更新了你的 Webpack 配置文件？你能和我们分享你的 Webpack 配置吗？
@robertp 我已经编辑了我的问题并添加了 webpack.config.js

标签： javascript reactjs sass

【解决方案1】：

错误：无法解决 './components/icons/components/icons/linearicons/Linearicons-Free.eot'

您似乎没有使用 webpack 插件、文件加载器或 url-loader 声明这些文件。

可能是这样

在您的 webpack.config.js 中，在 module.loaders 中，您必须附加此代码：

{ test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000' }

【讨论】：

webpack.config.js中没有得到module.loader
如果之前不存在，则必须自己添加。你可以关注下面的 webpack 文档：webpack.js.org/loaders/url-loader

【解决方案2】：

问题不在于 Sass 或您的软件包安装，而是 Sass 无法解析字体文件的相对路径。您需要添加一个名为 resolve-url-loader 的加载器来帮助 Sass 解析字体 URL。我们不知道您的 Webpack 文件是什么样的（或者您使用的是什么版本的 Webpack），但对于 Webpack 4 或 5，它应该类似于：

{
    test: /\.scss$/,
    loaders: [
        'style-loader',
        'css-loader',
        'resolve-url-loader', // add this before sass-loader
        'sass-loader',
    ]
},

添加 resolve-url-loader webpack 加载器后，您的 Sass 文件应该能够加载字体文件。

您需要安装 npm 包：

npm install resolve-url-loader --save-dev

这是sass-loader 的 Webpack 文档中对此的注释：https://webpack.js.org/loaders/sass-loader/#problems-with-url。

【讨论】：