DEV Community

loading...

Add comments in JSON file

Giulia Chiola
Front-end Developer. πŸ‘Ύ Media engineer. ⚑ Facing life one bug at a time. πŸ”₯ Easily bribed with chocolate. 🍫 she/her.
Originally published at giuliachiola.dev ・1 min read

Spoiler: I lied.

terminator-image

giphy video

As you know, you cannot and will never can add comments in JSON file but you can add something that seems a comment 😈:

"_____________________________CSS_____________________________": "",
Enter fullscreen mode Exit fullscreen mode

Using this key:value pair separator you can tidy a long and complex JSON as scripts in package.json

{
  "name": "super-styleguide",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "_____________________________CSS_____________________________": "",
    "stylelint": "stylelint 'src/scss/**/*.scss' || echo \"Stylelint failed for some file(s).\"",
    "scss-to-css-dev": "node-sass --output-style expanded src/scss/styles/develop -o src/css/",
    "css-to-postcss-dev": "postcss src/css --dir dist/css",
    "styles-dev": "npm run stylelint && npm run scss-to-css-dev && npm run css-to-postcss-dev",
    "_____________________________SVG_____________________________": "",
    "clean-svgo": "rimraf src/icons/svgo/*",
    "svg-optimize": "npm run clean-svgo && node scripts/svgo.js",
    "_____________________________Webpack bundle__________________": "",
    "bundle": "webpack --env.production",
    "bundle:uiengine:chunk": " cross-env NODE_ENV=production webpack --env.production --config webpack.uiengine.config.js",
    ...
    ...
  },
Enter fullscreen mode Exit fullscreen mode

πŸ“š More info

JavaScript Object Notation (JSON) - MDN

Discussion (0)