如何导入其他目录的SASS局部文件？Netbeans 8.1配置求助

文件结构 #

(根目录)
CSS
    mainCSSContainer.scss
    _partial1.scss
    _partial2.scss
    _partialn.scss

ANOTHER_DIR
    CSS
        _partialX.scss

ONE_MORE_DIR
    CSS
        _partialY.scss
...

问题现象 #

mainCSSContainer.scss中的导入代码：

@import '_partial1'; // 正常工作，下划线可选
@import 'partial2'; // 正常工作
@import 'partialn'; // 正常工作

@import '../ANOTHER_DIR/CSS/partialX'; // 报错：File to import not found or unreadable
@import 'partialX'; // 同样报错

尝试导入其他目录的SASS局部文件时，始终提示File to import not found or unreadable，核心原因是SASS编译器的目录搜索路径未正确配置。

解决步骤 #

1. 配置Netbeans 8.1的SASS编译路径 #

打开项目属性面板，找到CSS Preprocessors选项：

• 在Compiler Options输入框中，添加所有需要纳入搜索的目录，格式为--include_path "目录绝对路径"，多个路径在Windows下用分号分隔，Mac/Linux下用冒号分隔。
  示例：

  --include_path "${project.dir}/CSS" --include_path "${project.dir}/ANOTHER_DIR/CSS" --include_path "${project.dir}/ONE_MORE_DIR/CSS"
  

• 可直接替换${project.dir}为项目根目录的完整绝对路径，避免变量解析问题。

2. 用config.rb配置搜索路径（替代方案） #

若编译器选项配置无效，可手动创建config.rb文件：

• 文件内容示例：

  add_import_path "CSS"
  add_import_path "ANOTHER_DIR/CSS"
  add_import_path "ONE_MORE_DIR/CSS"
  

• 将config.rb放置在项目根目录下，Netbeans会自动读取该配置。

3. 修正导入语法 #

• 使用相对路径时，确保从当前文件（mainCSSContainer.scss所在的CSS目录）出发，路径层级计算正确：

  @import '../ANOTHER_DIR/CSS/partialX';
  

• 若已配置搜索路径，可直接导入文件名：

  @import 'partialX';
  

内容的提问来源于stack exchange，提问作者Brice C.