Экспорт вложенной карты SCSS в Json

Question

Я пытаюсь экспортировать мои scss в JSON npm пакет sass-export

Я могу успешно экспортировать переменные и карты на один уровень глубиной, но проблема в том, что у меня есть цветная карта (показана только первая часть, в которой много цветов), которая имеет два уровня глубины.Ошибка, которая выбрасывается о закрытых скобках.Все выглядит хорошо для меня, я следовал документации для экспорта карт, но я не могу найти больше информации по этому вопросу.Спасибо за любую информацию, которую вы можете предоставить.

Успешно экспортировано

$z-index: (
 "below-base": -1,
 "base":0,
 "xs": 100,
 "sm": 200,
 "md": 300,
 "lg": 400,
 "xl": 500
);

Консольный вывод

mapValue:Array(7)
0: {name: "below-base", value: "-1", compiledValue: "-1"}
1: {name: "base", value: "0", compiledValue: "0"}
2: {name: "xs", value: "100", compiledValue: "100"}
3: {name: "sm", value: "200", compiledValue: "200"}
4: {name: "md", value: "300", compiledValue: "300"}
5: {name: "lg", value: "400", compiledValue: "400"}
6: {name: "xl", value: "500", compiledValue: "500"}

Неудачно

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

Вывод ошибки терминала

{ Error: unclosed parenthesis
    at Object.module.exports.renderSync (C:\Users\tbilcke\Documents\repos\node_modules\node-sass\lib\index.js:439:16)
  status: 1,
  file: 'stdin',
  line: 193,
  column: 34,
  message: 'unclosed parenthesis',
  formatted: 'Error: unclosed parenthesis\n        on line 193 of stdin\n>> #sass-export-id.gray{content:"#{(0: #0D0D0D}";}\n   ---------------------------------^\n' }

Консольный вывод

colour-palette: Array(1)
 0:
    compiledValue:"(gray: (0: #0D0D0D, 1: #1A1A1A, 2: #262626, 3: #333333, 4: #5C5C5C, 5: #858585, 6: #ADADAD, 7: #D4D6DB))"
    mapValue: Array(1)
    0: {name: "gray", value: "(0: #0D0D0D", compiledValue: ""}
        length:1
        __proto__: Array(0)
    name: "$colour-palette"
    value :
"(gray: (0: #0D0D0D,1: #1A1A1A,2: #262626,3: $gray-base,4: #5C5C5C,5: #858585,6: #ADADAD,7: #D4D6DB),)"

Sass Export - Работает

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()
process.env.styles = JSON.stringify(asObject)

Answer 1

Недавно я столкнулся с той же проблемой и смог решить ее с помощью относительно безболезненного обходного пути.

Если вы возьмете в массив массивов вашего ребенка и разделите их следующим образом:

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

, а затемв отдельном файле scss (который вы не наблюдаете с помощью sass-export) загрузите их в родительский массив

$colour-palette: (
    'grey': $colour-palette-gray,
    'blue': $colour-palette-blue,
    'pink': $colour-palette-pink
);

. Вы также можете использовать синтаксис специального комментария над каждым объявлением дочернего массива, чтобы гарантировать, что узлы вJSON помечены правильно;

/**
 * @sass-export-section="brand-colors"
 */

Я использую реализацию модуля gulp таким образом, и она работает как нужно