Export Nested SCSS Map to Json - json

Question

I am attempting to export my scss to JSON npm package sass-export
I can successfully export variables and maps one level deep, but the problem is I have a colour map(shown is just the first portion there are many colours in it) that is two levels deep. The error that is thrown is about unclosed parenthesis. Everything appears good to me, I have followed the docs to export maps but I can't find much more info on the subject. Thanks for any insight you can provide.
Successfully exported
$z-index: (
"below-base": -1,
"base":0,
"xs": 100,
"sm": 200,
"md": 300,
"lg": 400,
"xl": 500
);
Console Output
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"}
Unsuccessful
$colour-palette: (
gray: (
0: #0D0D0D,
1: #1A1A1A,
2: #262626,
3: #333333,
4: #5C5C5C,
5: #858585,
6: #ADADAD,
7: #D4D6DB
),
);
Terminal Error Output
{ 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' }
Console Output
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 - Working
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

I recently encountered the same issue and managed to resolve it with a relatively painless workaround.
If you take your child arrays and separate them out like so;
$colour-palette-gray: (
0: #0D0D0D,
1: #1A1A1A,
2: #262626,
3: #333333,
4: #5C5C5C,
5: #858585,
6: #ADADAD,
7: #D4D6DB
);
and then in a separate scss file (which you dont observe with sass-export) load them into the parent array
$colour-palette: (
'grey': $colour-palette-gray,
'blue': $colour-palette-blue,
'pink': $colour-palette-pink
);
you can also use the special comment syntax above each child array declaration to ensure that the nodes in the JSON are labelled correctly;
/**
* #sass-export-section="brand-colors"
*/
I am using the gulp implementation of the module in this way and it works as desired