如何在现有的 Angular 项目中更新 SCSS？答案

【问题标题】：How to update SCSS in an existing angular project?如何在现有的 Angular 项目中更新 SCSS？
【发布时间】：2021-11-17 04:04:02
【问题描述】：

我正在尝试在我的 Angular 项目中更新 SCSS 的版本。在创建项目时，我在 angular cli 中选择了 scss，所以我已经在使用 SCSS。但现在我必须导入一个间距库，该库需要 SCSS 的 this version 中引入的 SCSS 选项“斜线作为除法”。

我试过了：

npm update -g sass
-> C:\Program Files\nodejs\sass -> C:\Program Files\nodejs\node_modules\sass\sass.js
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.3.2 (node_modules\sass\node_mod
ules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.3.2: want
ed {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ sass@1.43.4
added 15 packages from 18 contributors in 1.495s

但导入仍然失败并出现以下警告：

    Error: ./src/styles.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined function.
  ╷
6 │     @return math.div($number, ($number * 0 + 1));
  │             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  node_modules\@library-I-want-to-use\utilities\dist\scss\helper\_internal.scss 6:13      -
-p-strip-unit()
  node_modules\@library-I-want-to-use\utilities\dist\scss\helper\_helper.scss 12:10       p
-px-to-rem()
  node_modules\@library-I-want-to-use\utilities\dist\scss\variables\_font.scss 11:18      @
import
  node_modules\@library-I-want-to-use\utilities\dist\scss\functions\_typography.scss 1:9  @
import
  node_modules\@library-I-want-to-use\utilities\dist\scss\functions\_index.scss 3:9       @
import
  node_modules\@library-I-want-to-use\utilities\dist\scss\_index.scss 1:9                 @
import
  node_modules\@library-I-want-to-use\utilities\scss.scss 1:9                             @
import
  src\styles.scss 1:9

【问题讨论】：

标签： angular sass

【解决方案1】：

Sass 是 Angular 的一部分，因此将 Angular 更新到 Angular 12 就可以了。

【讨论】：