React SASS - 安装 SASS 模块时出错答案

【问题标题】：React SASS - Error to install SASS ModuleReact SASS - 安装 SASS 模块时出错
【发布时间】：2021-11-19 15:05:07
【问题描述】：

我正在尝试在我的 React 项目中使用 SASS 格式，但它警告我没有找到某些文件，但是 NPM 自动安装了所有内容，所以某些文件怎么会丢失。有人对如何解决这些错误有任何建议吗？

我尝试安装 2 个不同的 SASS 模块，但都出现相同的错误：

npm install sass
npm install node-sass

我的 SASS 代码：

body {
  padding: 0;
  margin: 0;
}

button {
  background: none;
  border: none;
  outline: none;
  &:hover {
    cursor: pointer;
  }
}

.app {
  font-size: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.board {
  .board-row {
    display: flex;
    flex-direction: row;
    border-bottom: 2px solid #000;
    &:last-child {
      border-bottom: none;
    }
    .square {
      width: 80px;
      height: 80px;
      border-right: 2px solid #000;
      font-size: 2.5rem;
      padding: 0;
      overflow: hidden;
      transition: all 0.2s;
      &:last-child {
        border-right: none;
      }
    }
  }
}

显示错误：

./src/styles/root.scss (./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/styles/root.scss)
Cannot find module 'sass'
Require stack:
- C:\Users\StarWars\Desktop\React\tictactoe\node_modules\sass-loader\dist\utils.js
- C:\Users\StarWars\Desktop\React\tictactoe\node_modules\sass-loader\dist\index.js
- C:\Users\StarWars\Desktop\React\tictactoe\node_modules\sass-loader\dist\cjs.js
- C:\Users\StarWars\Desktop\React\tictactoe\node_modules\loader-runner\lib\loadLoader.js
- C:\Users\StarWars\Desktop\React\tictactoe\node_modules\loader-runner\lib\LoaderRunner.js
- C:\Users\StarWars\Desktop\React\tictactoe\node_modules\webpack\lib\NormalModule.js
- C:\Users\StarWars\Desktop\React\tictactoe\node_modules\webpack\lib\NormalModuleFactory.js
- C:\Users\StarWars\Desktop\React\tictactoe\node_modules\webpack\lib\Compiler.js
- C:\Users\StarWars\Desktop\React\tictactoe\node_modules\webpack\lib\webpack.js
- C:\Users\StarWars\Desktop\React\tictactoe\node_modules\react-scripts\scripts\start.js

谢谢

【问题讨论】：

标签： reactjs npm sass npm-scripts

【解决方案1】：

这看起来像是您的 sass 代码本身的问题。可以发一下root.scss的内容吗？

【讨论】：

嗨，我在我的问题上添加了 SAS 代码。
您运行什么命令会产生错误？当你运行npm run dev 或类似的时候你看到这个了吗？

【解决方案2】：

sudo npm install --save-dev --unsafe-perm node-sass

sudo npm install --save-dev --unsafe-perm node-sass ...

你应该试试这个！

【讨论】：

也不行。

【解决方案3】：

前段时间我也遇到过同样的问题，但我做了这个并且效果很好：

npm cache clear --force
npm install sass

我希望这对你有用。

【讨论】：

我只是试了一下，但它不起作用。谢谢