是否有可能使用@import在sass中导入整个目录？
我使用SASS partials模块化我的样式表，如下所示：
@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 有没有一种方法来包括整个部分目录（这是一个目录充满SASS部分）像@import指南针或什么的？
如果您在Rails项目中使用Sass，则sass-rails gem（ https://github.com/rails/sass-rails ）具有导入glob的function。
@import "foo/*" // import all the files in the foo folder @import "bar/**/*" // import all the files in the bar tree
在另一个答案中回答这个问题：“如果你导入一个目录，你怎么能确定import顺序？没有办法不会引起一些新的复杂程度。”
有人会争辩说，组织你的文件到目录可以减less复杂性。
我的组织的项目是一个相当复杂的应用程序。 在17个目录中有119个Sass文件。 这些大致对应我们的观点，主要用于调整，重要的是由我们的定制框架来处理。 对我来说，几行导入的目录比119行导入的文件名要复杂一点。
为了处理加载顺序，我们把需要加载的文件放在一个早期的加载目录中 – mixin，variables等等。 否则，加载顺序是，应该是无关的…如果我们正在做的事情。
这个function永远不会成为Sass的一部分。 一个主要原因是import订单。 在CSS中，最后导入的文件可以覆盖之前所述的样式。 如果您导入目录，您如何确定导入顺序？ 没有办法不会引入一些新的复杂程度。 通过保留一个导入列表（就像你在你的例子中所做的那样），你对导入顺序是显式的。 如果您希望能够置信地覆盖在另一个文件中定义的样式或将mixin写入一个文件并在另一个文件中使用它们，这一点非常重要。
有关更深入的讨论， 请在此处查看此closures的function请求 ：
查看sass-globbing项目 。
我在partials的同一目录下创build一个名为__partials__.scss的文件
|- __partials__.scss |- /partials |- __header__.scss |- __viewport__.scss |- ....
在__partials__.scss ，我写了这些：
@import "partials/header"; @import "partials/viewport"; @import "partials/footer"; @import "partials/forms"; ....
所以，当我想要导入整个partials ，只需编写@import "partials" 。 如果我想导入其中的任何一个，我也可以写@import "partials/header" 。
你可以使用一些解决方法，把一个sass文件放到你想导入的文件夹中，并像这样导入这个文件中的所有文件：
文件path：main / current / _current.scss
@import "placeholders"; @import "colors";
而在下一个dir级别的文件中，您只需使用导入文件从哪个目录导入所有文件：
文件path：main / main.scss
@import "EricMeyerResetCSSv20"; @import "clearfix"; @import "current";
这样你有相同数量的文件，就像你正在导入整个目录。 注意订单，最后的文件将覆盖相匹配的阶梯。
http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#import
看起来不像。
如果这些文件中的任何一个总是需要其他文件，那么让他们导入其他文件，只导入顶层文件。 如果他们都是独立的，那么我认为你将不得不继续像现在这样做。
这对我来说工作得很好
@import 'folder/*';
你可能想保留源代码，然后你可以使用这个。
//sass @import 'foo', 'bar';
我更喜欢这个。
我也寻找你的问题的答案。 对应的答案正确的导入所有function不存在。
这就是为什么我写了一个Python脚本，你需要把它放到你的scss文件夹的根目录下，如下所示：
- scss |- scss-crawler.py |- abstract |- base |- components |- layout |- themes |- vender
然后它将遍历树并find所有的scss文件。 一旦执行，它将创build一个名为main.scss的scss文件
#python3 import os valid_file_endings = ["scss"] with open("main.scss", "w") as scssFile: for dirpath, dirs, files in os.walk("."): # ignore the current path where the script is placed if not dirpath == ".": # change the dir seperator dirpath = dirpath.replace("\\", "/") currentDir = dirpath.split("/")[-1] # filter out the valid ending scss commentPrinted = False for file in files: # if there is a file with more dots just focus on the last part fileEnding = file.split(".")[-1] if fileEnding in valid_file_endings: if not commentPrinted: print("/* {0} */".format(currentDir), file = scssFile) commentPrinted = True print("@import '{0}/{1}';".format(dirpath, file.split(".")[0][1:]), file = scssFile)
输出文件的一个例子：
/* abstract */ @import './abstract/colors'; /* base */ @import './base/base'; /* components */ @import './components/audioPlayer'; @import './components/cardLayouter'; @import './components/content'; @import './components/logo'; @import './components/navbar'; @import './components/songCard'; @import './components/whoami'; /* layout */ @import './layout/body'; @import './layout/header';
都会编译到
- @import“foo.css”;
- @import“foo”屏幕;
- @import“ http://foo.com/bar ”;
也可以在一个@import中导入多个文件。 例如：
@import“圆angular”，“文字阴影”;
