jsontosass

Oh, no! Not another JSON to Sass converter! Why did you do that?

Simple answer: there was no JSON to Sass converter out there (up to this point) that was flexible enough to suite my needs to e.g. satisfy my scss-lint configuration.

This one here aims to be as flexible as possible regarding

• generation of your Sass variables
• indentation for maps
• minification
• Syntax output (Sass and SCSS)

Additionally I want this module to be well tested, that's why I'm focussing on TDD here.

What you will get with this package is a well maintained, documented and tested JSON to Sass converter that will definitely be the last one you'll ever need!

Installation

You can easily install this package with npm:

npm install jsontosass

After that you can access jsontosass easily by using require

var jsontosass = require('jsontosass');

Usage

There are 3 main functions available.

convert()

jsontosass.convert(/* String */jsonInput, /* Object */options);

convert() returns the generated Sass code as a string.

convertFile()

jsontosass.convertFile(/* String */jsonInputFilePath, /* String */sassOutputFilePath, /* Objects */options, /* Function */callback);

convertFile() does not return anything. It automatically creates the output file if it's nonexistent and writes the generated Sass code into it. This happens asynchronously. The callback is called afterwards.

convertFileSync()

jsontosass.convertFileSync(/* String */jsonInputFilePath, /* String */sassOutputFilePath, /* Objects */options);

Same as convertFile() but synchronously and obviously without callback parameter.

Options

(Int/String) indent

default: 4

If a number greater 0 is given, jsontosass will indent using the given number of spaces. Optionally you can set it to 'tabs'. This will indent using \t. Indentation is only made, when prettify is set to true.

Boolean prettify

default: true

If set to true jsontosass will pretty print the generated Sass code using the indent setting.

Int spaceAfterColon

default: 1

Sets the amount of spaces after the colon :.

Int spaceBeforeColon

default: 0

Sets the amount of spaces before the colon :.

String syntax

default: 'scss'

Sets the syntax output. Possible values: 'sass' or 'scss'

Boolean useMaps

default: true

If set to true jsontosass generates Sass maps for inner objects. If set to false jsontosass generates dashed variables.

Example

{
    "key": {
        "inner-key": [1,2,3],
        "some-object": {
            "color-black": "#000",
            "font-family": "'Helvetica, sans-serif'"
        }
    }
}

jsontosass.convert(json, {
    indent: 2
});

$key: (
  inner-key: (
    1,
    2,
    3
  ),
  some-object: (
    color-black: #000,
    font-family: 'Helvetica, sans-serif'
  )
);

Contribution

You're free to contribute to this project by submitting issues and/or pull requests. This project is test-driven, so keep in mind that every change and new feature should be covered by tests. This project uses the semistandard code style.

License

This project is licensed under MIT.