从 Angular 13 开始，SCSS @use 语句中的波浪线 ~ 不再解析为 node_modules

Question

将 Angular 12 项目升级到 Angular 13 后，我遇到了一个问题：SCSS 不再在库中查找共享样式表。波浪号 (~) 似乎不再解析为 node_modules。

破碎的： @use '~my-angular-lib' as lib;

作品： @use '../node_modules/my-angular-lib' as lib;

我注意到从 Angular 13 开始，角度材质只是直接引用“@angular/material”，但我不知道如何让它与我的库一起使用。node_modules每次都使用相对路径似乎有点老套。

当前在 node_modules 中引用样式表的最佳方法是什么，或者我在 ~ 不再指向 node_modules 时缺少什么？

Answer 1

我遇到了同样的问题并找到了解决方案：

1. 打开 angular.json 文件；

2. 在每个应用程序配置集中：

    "stylePreprocessorOptions": {
      "includePaths": [
        "./node_modules"
      ]
    }  
   

3. 在每次导入中删除〜；

Answer 2

一段时间以来，Angular 一直反对使用~for Sass@use和语句。@import

正式地，从 Angular 版本 13 开始，将不再支持波浪线导入的使用。

这里是关于为什么这在没有波形符的情况下工作的原因