当使用SASS时，我怎样才能从一个不同的目录导入一个文件？
在SASS中，是否可以从其他目录导入文件？ 例如，如果我有这样的结构：
- root_directory - sub_directory_a - _common.scss - template.scss - sub_directory_b - more_styles.scss template.scss可以使用@import "common"导入_common.scss，但是more_styles.scss可能导入_common.scss？ 我尝试了一些不同的东西，包括@import "../sub_directory_a/common"和@import "../sub_directory_a/_common.scss"但似乎没有任何工作。
看起来像SASS的一些改变使得你最初尝试做的事情成为可能：
@import "../subdir/common";
我们甚至得到了这个工作的一些完全不相关的文件夹位于c:\projects\sass ：
@import "../../../../../../../../../../projects/sass/common";
只需添加足够的../ ，以确保你将最终在驱动器的根源，你很好去。
当然，这个解决scheme还不是很漂亮，但是我不能从一个完全不同的文件夹导入工作，既不使用I c:\projects\sass也没有将环境variablesSASS_PATH （从:: load_paths引用 ）设置为相同的价值。
您可以使用-I命令行开关或从Ruby代码的:load_paths选项将sub_directory_a添加到Sass的加载path。 因此，如果您从root_directory运行Sass，请执行以下操作：
sass -I sub_directory_a --watch sub_directory_b:sub_directory_b
那么你可以简单地在more_styles.scss使用@import "common" 。
使用带有sass-loader的webpack我可以使用〜来引用项目根path。 例如，假设OPs文件夹结构，并且您在sub_directory_b中的文件：
@import "~sub_directory_a/_common";
请参阅sass-loader自述文件中的Usage / Imports： https ： //github.com/webpack-contrib/sass-loader
Gulp将会做这个工作来观看你的sass文件，并且用includePaths添加其他文件的path。 例：
gulp.task('sass', function() { return gulp.src('scss/app.scss') .pipe($.sass({ includePaths: sassPaths }) .pipe(gulp.dest('css')); });
所选答案不提供可行的解决scheme。
OP的做法似乎不规范。 共享/公用文件通常位于partials文件（标准样板文件目录）下。 然后，您应该将partials目录添加到您的configuration导入path中，以便parsing代码中的任何部分。
当我第一次遇到这个问题的时候，我想SASS可能会给你一个类似于__dirname的__dirname的全局variables，它保留了一个到项目根的绝对path。 不幸的是，它没有，原因是因为@import指令的插值是不可能的，所以你不能做一个dynamic的导入path。
根据SASS文件 。
你需要在你的Sassconfiguration中设置:load_paths 。 由于OP使用Compass，我将根据文档在这里与之相关。
你可以使用CLI解决scheme，但是为什么？ 将它添加到config.rb会更方便。 使用CLI重写config.rb （例如，不同的构buildscheme）是有意义的。
所以，假设您的config.rb在项目根目录下，只需添加以下行： add_import_path 'sub_directory_a'
现在@ @import 'common'; 在任何地方都能正常工作。
虽然这回答OP，还有更多。
附录
您很可能会遇到想要以embedded的方式导入CSS文件的情况，即不是通过CSS提供的vanilla @import指令，而是实际将CSS文件内容与您的SASS合并。 还有另外一个问题 ，这个问题得到了很好的回答（解决scheme不适用于跨环境）。 那么解决办法就是使用这个 SASS扩展。
安装完成后，将以下代码行添加到你的configuration文件中： require 'sass-css-importer' ，然后在代码中的某处@import 'CSS:myCssFile';
注意这个扩展名必须被省略才能使用！
然而，当我们尝试从非默认path中导入CSS文件时，我们会遇到同样的问题，并且add_import_path不尊重CSS文件。 所以为了解决这个问题，你需要在你的configuration中添加另一行，这自然是相似的：
add_import_path Sass::CssImporter::Importer.new('sub_directory_a')
现在一切都会很好地工作。
PS，我注意到sass-css-importer文档指出除了省略.css扩展名之外，还需要一个CSS:前缀。 我发现它的工作不pipe。 有人提出了一个问题 ，到目前为止还没有答案。
这是一个答案。
看看Compass ，用它你可以将你的_common.scss partials文件夹中，然后用@import common导入它，但是它可以在每个文件中使用。
我遇到了同样的问题。 从我的解决scheme，我进入了这一点。 所以这里是你的代码：
- root_directory - sub_directory_a - _common.scss - template.scss - sub_directory_b - more_styles.scss
据我所知，如果你想导入一个scss到另一个它必须是一个部分。 当你从不同的目录名称中导入你的more_styles.scss到_more_styles.scss 。 然后将其导入到您的template.scss像这样@import ../sub_directory_b/_more_styles.scss 。 它为我工作。 但正如你所说的../sub_directory_a/_common.scss不工作。 这是template.scss的同一个目录。 这就是为什么它不会工作。
你实际上只需要不用“../”就可以了，并且将“_”添加到正在导入的文件中
在template.scss中：
@import "sub_directory_b/_more_styles.scss"
并将more_styles.scss更改为_more_styles.scss
我有同样的问题，我发现通过添加文件的path解决scheme，如：
@import“C：/ xampp / htdocs / Scss_addons / Bootstrap / bootstrap”;
@import“C：/ xampp / htdocs / Scss_addons / Compass / compass”;
