将css样式移动到Sass文件的最佳实践

Question

我们目前的角4项目目前使用纯Css，但我建议使用SASS。我将使用VSCode IDE和Live编译器扩展(到目前为止运行良好)，webpack用于绑定当前的"..\src\styles.css“文件。

我已经将一些800+行从styles.css移到_base.scss (原样)，我创建的新sass文件夹结构是：

• src

- sass

_base.scss

_variables.scss

main.scss

​

其中main.scss看起来像：

@import "_variables.scss";
@import "_base.scss";

我的主要问题是两个文件夹:将所有这些样式重构到我的新main.scss文件中的最佳实践是什么？我应该在_varialbes.scss中创建新的sass变量并在_base.scss中使用它们吗？

如果我的问题太宽泛，我会尽量缩小范围。

打招呼。

Answer 1

如果使用_base.scss，则可以在"@import _variables.scss";上使用新变量。当您导入scss files _时，您不需要使用scss files，_只是表示部分。

您可以在不使用_的情况下导入scss文件。

@import "variables.scss";
@import "base.scss";

以下是一些最佳实践链接