从Angular2 NgModule访问共享样式

Question

我有一个Angular2项目（由angular-cli生成）。在项目中，我有一个主模块和一个子模块。子模块代表一个定义明确的概念，因此很适合将其作为（可能重复使用的）NgModule。

子模块封装了不同的组件，只向外暴露一个组件。这一切都很好，它运行良好，因此模块可以重复使用。

但是，该模块确实具有一个全局依赖关系，从而阻止它完全解耦，可重用的模块。 scss文件使用scss访问公共@import文件。公共scss文件位于模块之外。

因此，具体而言，模块内的scss样式文件使用相对路径引用模块外部的scss文件，如下所示：

@import './../../../assets/styles/common-props';

我不想将scss文件复制到模块中。使用公共scss文件的最佳方法是什么，以便模块易于重用？有最好的做法吗？

Answer 1

不确定这里是否真的有最好的做法。这完全取决于您希望如何导入和管理外部SCSS资源。

1. 如果您希望通过Homebrew或NPM更新更新SCSS资源，那么从其源目录导入它是可行的方法。
2. 如果要手动控制SCSS资源的升级路径，只需将文件移动到SCSS层次结构中并导入。

一般来说，我更喜欢方法＃2。

我有一个名为＆＃39; libs＆＃39;的目录。我将外部SCSS / CSS文件组织成并简单地导出该文件夹结构。

有些边缘情况我使用＃1，但它们很少见。