如何在Angular 7中为绝对路径配置手写笔？

Question

我的Angular应用配置为使用Stylus进行样式设置。我几乎所有组件的样式都继承自src/styles/common.styl，后者提供配置和混合。但是，这意味着我的手写笔文件都具有较长的相对路径：

@import '../../../../styles/common';

这还意味着，当我们设置一个新组件时，我们必须添加此行，然后根据其文件夹嵌套级别确定要添加的../的适当数量。

我希望能够为我们的Stylus代码使用绝对路径。这意味着无论文件夹嵌套级别如何，都可以从应用程序的任何组件中使用如下所示的导入：

@import '/styles/common';

在Angular 7中实现Stylus导入的绝对路径的最佳实践是什么？

通过配置手写笔加载器看起来像this is theoretical possible，但是我找不到针对Angular的干净方法。 Custom webpack configs似乎是一个相关选项，但它们似乎是用于整体替换默认配置的，而不仅仅是用一部分配置对其进行修改，而且我宁愿不必从头开始重做Webpack配置如果可以避免的话，只需配置手写笔设置即可。

Answer 1

在Stylus中，您可以使用〜：轻松进行根相对样式的导入：

@import "~src/styles/common";

tsconfig.json根目录中的baseUrl是：

"baseUrl": "./",

使用不同的baseUrl，您将需要不同的导入模式。例如，src/的baseUrl要求您使用@import "~styles/common"作为路径，以便仍解析为src/styles/common。