sass - 如何在不同的导入文件之间共享变量？

Question

我想以模块化的方式使用 SASS。在下面的代码段中，您可以看到我考虑组织页面布局的一种方式。

我想到的是C 等语言中的外部变量。

// file: some_page.scss  
//   
// I want some variables from the fonts, colors partials  
// to be visible to the buttons partial  
// Is it possible?   
// error: _buttons.scss (Line X: Undefined variable: "$color_blue")

@import "colors"  
@import "fonts"  
@import "buttons" 

// in file: _colors.scss  
$color_blue: blue;

// in file: _buttons.scss  

.button {
    background-color: $color_blue;
}

Answer 1

是的，它就是这样工作的。

只要_colors.scss是在其他文件之前导入。

你可以在这里查看 Twitter Bootstrap 到 Sass 的端口：https ://github.com/thomas-mcdonald/bootstrap-sass它以类似的方式使用变量。

Answer 2

您需要;在行尾添加一个@import。