使用sass-export导出嵌套SCSS Map至JSON时遇未闭合括号错误

我之前也碰到过sass-export处理嵌套SCSS Map时的类似坑，结合自己踩过的经验和社区反馈，给你几个可行的解决思路：

1. 优先升级sass-export到最新版本 #

旧版本的sass-export对嵌套Map的解析存在明显bug，比如在处理多层嵌套键值对时，会错误截断内容导致括号不匹配。你可以先执行下面的命令升级：

npm update sass-export

很多用户反馈升级到最新版后，嵌套Map的导出问题直接就解决了，这是成本最低的尝试方案。

2. 临时调整SCSS嵌套Map的写法（兼容方案） #

如果升级后问题依旧，可以尝试给嵌套Map的所有键加上引号，比如把你的颜色Map修改成：

$colour-palette: ( 
  "gray": ( 
    "0": #0D0D0D, 
    "1": #1A1A1A,
    "2": #262626,
    "3": #333333,
    "4": #5C5C5C,
    "5": #858585,
    "6": #ADADAD,
    "7": #D4D6DB 
  ), 
);

sass-export对带引号的键解析逻辑更稳定，能避免解析嵌套结构时的语法识别错误，亲测这个方法能绕过不少嵌套解析的bug。

3. 自定义代码修复不完整的嵌套Map解析结果 #

如果上面的方法都不行，你可以在导出后手动处理异常的嵌套Map数据。核心思路是检查变量的原始值是否有未闭合的括号，补全后再重新解析成结构化的对象：

let __root = path.join(__dirname, '../') 
let __src = path.join(__dirname, '../src') 
let exportPath = path.join(__src, 'scss/_test_cars.scss') 
let importPath = path.join(__src, 'scss/') 
let options = { 
  inputFiles: [exportPath], 
  includePaths: [importPath] 
} 

let asObject = exporter(options).getStructured();

// 修复嵌套Map的工具函数
function repairNestedMap(variable) {
  if (!variable.mapValue || !variable.value.includes('(')) return variable;

  // 统计括号数量，补全缺失的闭合括号
  const openCount = (variable.value.match(/\(/g) || []).length;
  const closeCount = (variable.value.match(/\)/g) || []).length;
  if (openCount <= closeCount) return variable;

  const fixedRawValue = variable.value + ')'.repeat(openCount - closeCount);
  // 提取嵌套Map的内容并拆分键值对
  const nestedContent = fixedRawValue.replace(/^\(|\)$/g, '').split(', ');
  
  variable.mapValue = nestedContent.map(item => {
    const [keyPart, valuePart] = item.split(': ');
    const name = keyPart.trim().replace(/^["']|["']$/g, ''); // 去掉引号
    const value = valuePart.trim();
    return { name, value, compiledValue: value };
  });

  return variable;
}

// 遍历所有变量，修复有问题的嵌套Map
asObject.variables = asObject.variables.map(repairNestedMap);

process.env.styles = JSON.stringify(asObject);

这个方法可以临时修复解析不完整的嵌套Map，适合紧急上线的场景。

4. 向sass-export仓库提交bug反馈 #

如果以上方法都无法彻底解决问题，建议去sass-export的代码仓库提交issue，附上你的SCSS代码片段、错误日志和使用的版本号，开发者可能会针对这个嵌套解析的bug发布专门的修复版本。

内容的提问来源于stack exchange，提问作者bilcker