是否有任何官方文档指定〜（波浪号）解析为 Angular scss 导入路径中的 node_modules/ ？

Question

当在 scss 导入路径中使用波浪号 (~) 时，它会在 Angular 中扩展为 node_modules/。是否有任何官方文档说这是 Angular 或 webpack 的功能？

到目前为止，我在这件事上发现的只是一些关于以前 Angular 版本的错误报告，说它已经坏了，还有一条评论说它是 an implementation detail that shouldn't be relied upon。

我希望执行ng eject 并检查配置，但该命令不再可用。

如果有人能指出一些官方文档说明~ 是node_modules/ 路径的简写，或者指定替换的一段源代码（例如配置文件），我将不胜感激. :)

基本上，我想弄清楚为什么会这样，以及如何。

Answer 1

这是 WebPack 的一个特性。波浪号解析由 Webpack 的 sass-loader 插件处理。我相信此功能的好处是可以将字体、图像等资源导入 直接从 WebPack 包中导入到 CSS 文件中。因此，它必须支持相同的语法来解析 WebPack 路径。

在importsToResolve.js文件中实现。

https://github.com/webpack-contrib/sass-loader/blob/aa9b53b4d1c14117c4ca114a13cecb6e53b4e87a/src/importsToResolve.js#L12

这是一个很棒的功能，但是当你想在 WebPack 和非 Webpack 项目之间共享 SASS 文件时会带来问题，因为node-sass 不支持这个功能。