我用SASS部分模块化我的样式表,就像这样:

@import partials/header
@import partials/viewport
@import partials/footer
@import partials/forms
@import partials/list_container
@import partials/info_container
@import partials/notifications
@import partials/queues

有没有办法包括整个partials目录(它是一个充满sas -partials的目录),比如@import compass之类的?


当前回答

http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#import

看起来不像。

如果这些文件中的任何一个总是需要其他文件,那么让它们导入其他文件,并且只导入顶级文件。如果它们都是独立的,那么我认为你将不得不像现在这样继续做下去。

其他回答

看看ass-globbing项目。

我创建了一个名为__partials__的文件。SCSS在同一目录的部分

|- __partials__.scss
|- /partials
   |- __header__.scss
   |- __viewport__.scss
   |- ....

在__partials__。scss,我写了这些:

@import "partials/header";
@import "partials/viewport";
@import "partials/footer";
@import "partials/forms";
....

所以,当我想导入整个partial时,只需写@import "partials"。如果我想导入其中任何一个,我也可以写@import "partials/header"。

通过定义要导入的文件,可以使用所有文件夹的通用定义。

因此,@import "style/*"将编译style文件夹中的所有文件。

更多关于Sass的导入特性,你可以在这里找到。

Dennis Best给出的公认答案是:“否则,加载顺序是而且应该是无关紧要的……如果我们做得正确的话。”这是不正确的。 如果你做的事情是正确的,你使用css的顺序来帮助你减少特异性和保持你的css简单和干净。

我组织导入的方法是添加一个_all。scss文件在一个目录,在那里我导入所有相关的文件,在正确的顺序。 这样,我的主导入文件就会简单而干净,就像这样:

// Import all scss in the project

// Utilities, mixins and placeholders
@import 'utils/_all';

// Styles
@import 'components/_all';
@import 'modules/_all';
@import 'templates/_all';

如果你需要,你也可以为子目录这样做,但我不认为你的css文件的结构应该太深。

虽然我使用了这种方法,但我仍然认为在sass中应该存在glob导入,用于顺序无关紧要的情况,比如mixin目录甚至动画。

这对我来说很有效

@import 'folder/*';