Convert JSON files to anything you want!
JSON to makes it possible to create any type of file using JSON data. We provide the tool, you provide the input and the template.
It is initially made to use create Sass/SCSS files from JSON. Defining settings in a json file which can be used by a frontend and automatically generate SCSS settings files.
- Install the script
npm install @sil/jsonto --save-dev
-
Create a template
-
Add the script to your package.json
{
...
"scripts": {
...
"build:config": "jsonto src/config.json src/scss/config.scss src/templates/my-config.template"
...
}
...
}
- Run it!
npm run build:config
You can run json also using NPX. Example command;
npx @sil/jsonto source.json output.scss example.template
JsonTo needs 3 arguments as in the example above
- Source (json file)
- Output (.scss)
- Template file
The template engine uses EJS, so you can add anything in the file you want. A simple example to build a Sass config file;
my-config.template
$my-config: (
<% Object.keys(data).forEach((key, index)=>{ -%>
"<%- key %>": "<%- data[key]%>"<% if(index == data.length){ %>,<%}%>
<% }) -%>
)!default;
For now, JSON To has been mainly used for SCSS templates. Thats why it provides a few extra functions to use with Sass. Because a json object isn't 1:1 usable in SCSS.
type | Description | |
---|---|---|
toSassValue |
function | Converts a value to a valid Sass value |
toSassObject |
function | Converts a whole object to a Sass object |
sassData |
string | The full data object converted to a valid Sass list |