using json objects in SASS

[v3nt]

Just wondering if there's an example of how this works with json objects as maps / array?

ie how do you call variable from this in the SASS files?

Thanks.

{
  "colors": {
    "primary": "#2c97de",
    "secondary": "#7F8FA4",
    "warning": "#f2c500",
    "success": "#1fce6d",
    "danger": "#e94b35",
    "error": "#e94b35"
  }
}

Tried this...

// json vars attempt
@import "../vars.json";
@debug map.get($colors, "primary");

error

% yarn build
yarn run v1.17.3
$ webpack --progress --config resources/assets/build/webpack.config.js
{
  colors: {
    primary: '#2c97de',
    secondary: '#7F8FA4',
    warning: '#f2c500',
    success: '#1fce6d',
    danger: '#e94b35',
    error: '#e94b35'
  }
}
Error: Failed because of a stylelint error.

 at /Users/danielcrabbe/Sites/foundlocations.co.uk/wp-content/themes/found-theme-sage-test/node_modules/stylelint-webpack-plugin/lib/run-compilation.js:39:14
error Command failed with exit code 1.

thanks, D.

[pmowrer]

@v3nt Looks correct to me. Is it possible the error is occurring somewhere else? It's a rather opaque error message

[rootwork]

@v3nt I've been doing this myself (see #101) with gulp and it's working. Maybe it's something to do with your linter or webpack?