CODEWITHSUNDEEP
cssjsonwebsass
Raul
Raul

Reputation: 155

Sass: How can I decode JSON file directly into a Sass variable?

Is possible decode a JSON file with Node-Sass?

Ex:

@import "../data/data.json";

I need iterate this data directly into a variable

Any help is welcome :)

Upvotes: 14

Views: 19134

Answers (3)

John Slegers
John Slegers

Reputation: 47081

There's a gem called Sass JSON Vars that does exactly what you want.

You can install the gem with the following command line code:

gem install sass-json-vars

HOW TO USE Sass JSON Vars

For projects using Sass >= 3.3

Place variables in a JSON file:

// variables.json
{
    "font-sans": "Helvetica, sans-serif",
    "colors": {
        "red": "#c33"
    }
}

Import the file in Sass to expose variable names:

@import "variables.json"

body {
    color: map-get($colors, red);
    font: $font-sans;
}

Require sass-json-vars when compiling:

sass style.scss -r sass-json-vars

For projects using Sass <= 3.2

Place variables in a JSON file:

// variables.json
{
    "font-sans": "Helvetica, sans-serif",
    "colors-red": "#c33"
}

Import the file in Sass to expose variable names:

@import "variables.json"

body {
    color: $colors-red;
    font: $font-sans;
}

Require sass-json-vars when compiling:

sass style.scss -r sass-json-vars

More info :

Upvotes: 10

Stiggler
Stiggler

Reputation: 2800

sass-json-vars is an excellent gem, but won't work with node-sass (which is a requirement of the original question).

Instead, try node-sass-json-importer, which is essentially the same thing, only re-worked to fit into node-sass's importer api.

Upvotes: 13

agconti
agconti

Reputation: 18093

I'm not quite sure how you would do it but here is a great example on how to add custom ruby functions to sass:

https://gist.github.com/chriseppstein/1561650

And heres one on how to parse json:

Parsing a JSON string in Ruby

Maybe after putting them together you could do something like this?

module Sass::Script::Functions
  def json(Sass::Script::String)
    require 'rubygems'
    require 'json'
    JSON.parse(string)
  end
end

Add it to the end of your config.rb file, and make sure you have json ruby gem installed:

gem install json

and run:

compass compile --force

to get it all to work.

* this is obviously untested and doesn't work, but it might help you get where you need to go.

Upvotes: 0

Related Questions