在 Angular2 组件中导入 SASS 部分答案

【问题标题】：import of SASS partials in Angular2 components在 Angular2 组件中导入 SASS 部分
【发布时间】：2017-05-01 04:59:01
【问题描述】：

我正在使用 SASS 设计我的网站，并在单独的文件中开发了一些部分内容，例如 _partials.scss。现在我想在我的各种组件的 scss 文件中使用这些变量和 mixins。所以我将此 scss 导入到 styles.scss 文件中，该文件位于 \src 文件夹中。但是每个组件级别的 scss 文件都不能使用 mixins 和变量。

所以，接下来我将这些部分导入到每个组件 scss 文件中。这工作正常。但这是在所有组件样式表中导入部分的好方法吗？有什么更好的解决方案？

附：我正在使用 Angular CLI 和 webpack。 Angular 2 版本 2.3.0

谢谢！

【问题讨论】：

标签： css angular sass

【解决方案1】：

在 style.sass 中你可以导入 css / scss 链接。

【讨论】：

【解决方案2】：

这是一个好方法。项目中的每个.scss 文件都应该知道它的依赖关系，这就是@import 总是好的原因。

您可以改进的是将部分添加到 includePaths（如果您使用 node-sass），您可以直接使用 @import 'partials'; 而不是 @import '../../my/long/path/to/partials'; 或将样式作为单个文件（不是组件级别样式）。

【讨论】：

很抱歉打扰您，但您可以举一个示例，如何在 ng cli 项目中使用 includePaths。谢谢
@smnbbrv 感谢您的确认，应 Wisher 的要求，您能否提供 includePaths 的示例或参考链接也可能有所帮助。
大家好，只需检查 github.com/sass/node-sass 并搜索 includePaths
我不明白如何在 cli 中使用它，这可能适用于 gulp，但在 ng cli 中我没有单独的 node-sass 配置。它只是 package.json 中用于编译时活动的导入。