Question

In Less我可以做这样的事情

@basePath:"../../some_crazy_project_path_to_repeat/less/";
@import "@{basePath}less.less";

所以我试着在Sass中做同样的事情

$basePath:"../../some_crazy_project_path_to_repeat/less/";
@import "${basePath}less.scss";
// Syntax error: File to import not found or unreadable: ${basePath}less.scss.

和

@import "#{basePath}less.scss";
// Syntax error: File to import not found or unreadable: #{basePath}less.scss.

在Sass中有没有办法做到这一点？

Answer 1

您无法在SASS中使用条件资料进行导入。

考虑从项目中创建Compass扩展名。

Answer 2

您不能如前所述在导入路径中使用变量。您可以做的是使用-I或--load-path选项指定要搜索的目录。

sass --watch sass/:css/ --load-path ../../path/to/library/

我们假设你有一个像这样的目录结构：

themes
    hotdog
        _variables.scss
    classic
        _variables.scss
styles.scss

您的styles.scss应具有相对于提供的加载路径的导入路径：

// note the import here doesn't contain themes, hotdog, or classic
@import "variables"; 

@debug $foo;

你的命令看起来像这样：

# hotdog
sass styles.scss hotdog.css --load-path ./themes/hotdog/
# classic
sass styles.scss classic.css --load-path ./themes/classic/

有关详细信息，请参阅Sass options documentation。

可以在Sass文件的import语句中使用变量吗？

2 个答案: