编辑（清除）：

Question

我有几个sass文件：

_common.sass - 全局使用的所有内容，包括变量，mixins等。
partials/_partial.sass - 部分样式
homepage.sass - 特定主页

现在出现问题：

如果我将_common.sass导入partial/_partial.sass，然后将partials/_partial.sass导入homepage.sass，那么_common.sass会被编译两次。坏。

重点是homepage.sass必须引用_common.sass，所以它可以扩展全局类定义并使用mixins和os，以及_partial.sass必须有从_common.sass访问全局内容。但_partial.sass本身必须导入homepage.sass。

听起来非常简单和不值得，但我很难解决这个难题。

编辑（清除）：

// _common.sass
.sprite
    background: url(sprite.png)

// _partial.sass
@import "common"
.link
    @extend .sprite

// homepage.sass
@import "common"
.social
   @extend .sprite
@import "partials/partial"

正如您所看到的那样，主页和部分扩展全局类.sprite。这就是我想要实现的目标。但最后，主页获取了每个嵌套导入编译的_common.sass的全部内容（特别是示例中的2次）

Answer 1

我建议如下：只需创建一个最初会添加_common.scss的文件。

// index.scss
@import "common"
@import "homepage"
   // inside homepage
   @import "partials/partial";

如果你这样做，我认为共同的东西可用于主页和部分，因为它们是在它们上面导入的。即你不需要导入常见的内部主页或部分。

Answer 2

'主'SASS文件的布局

我通常这样做的方法是在我的site.scss文件的开头包含该文件。

<强> site.scss

// variables, mixins, etc. at beginning
@import "common/_variables"
@import "common/_mixins"
@import "common/_sizes"
// ...

// your styles that use the variables, mixins, etc.
@import "modules/_blah"
// ...

请注意，如果文件仅包含mixins，变量等，则可以多次包含它，因为不会产生任何输出。对于某些文本编辑器/ IDE，您需要执行此操作才能启动intellisense。

_filename标准

SASS有一个标准的命名约定，即以下划线_开头的文件不打算编译，仅用作其他文件的部分文件。使用此命名约定可能会停止编译错误，具体取决于您正在使用的工具。

SASS：如何使用跨文件扩展名？

编辑（清除）：

2 个答案:

'主'SASS文件的布局

_filename标准