Angular-CLI会话

Question

我正在使用最新版本的Angular-CLI创建一个Angular2项目。我有一个sass文件，其中的变量位于src/sass/style/_vars.scss中。是否可以配置sass编译器，使我只需编写

@import "vars";

而不是写出完整路径或相对路径？

Answer 1

你真走运。参见this pr。

例如，在使用sass时，您可能希望在angular-cli.json中向应用程序配置中添加一个stylePreprocessorOptions对象。例如：

"apps": [
    {
        "stylePreprocessorOptions": {
            "includePaths": [
                "styles" // This would point to the `my-app/src/styles` directory
            ]
        }
    }
]

在这里，如果您有一个scss文件，比如my-app/src/styles/_vars.scss，那么您可以

@import 'vars'

跨您的应用程序scss文件。

请记住，至少要将angular-cli 1.0.0-beta.26**.**更新为

Answer 2

使用stylePreprocessorOptions是一种选择，我相信这是一种旧的变通方法/功能。

现在您可以像这样使用代字号~符号：

@import '~variables';

我不会导入下划线文件，而是有一个入口点，它可以在一个文件中提供更多的内部结构，考虑混入、字体、颜色……

所以在你的例子中应该是这样的：

@import '~assets/styles/main.scss';