Question

[Update: 8 hours after this question was posted, the author of JSON bundle was notified of the issue and he fixed it.]

I have the following JSON data in a file application.json, shown at the end of this post, and I have used TextMate with the JSON bundle, Emacs, BBEdit, and Sublime Text 2 to properly indent it, but all seemed like they couldn't.

Both TextMate and Sublime Text 2 insisted that the first { should not be indented, and the first major issue was for the closing brace for "child": {. Both TextMate and Sublime Text 2 refused to align the } under the left side of "child": {. Emacs kept on indenting further and further for each line, and BBEdit didn't seem to have an re-indent function at all (could this be?).

Is there a way to properly indent the file, or are TextMate and Sublime Text 2 both doing the right thing for the JSON data?

[ 
{
    "settings": [ "master" ],
    "appPort": "8666",
    "specs": {
        "frame" : {
            "type" : "HTMLFrameMojit",

            "config": {
                "deploy": true,
                "child": {
                    "type" : "HelloWorldMojit"
                    },
                    "assets": {
                        "top": {
                            "css": [
                            "/static/HelloWorldMojit/assets/index.css"
                            ]
                        }
                    }
                }
            }
        }
        },
        {
            "settings": [ "environment:development" ],
            "staticHandling": {
                "forceUpdate": true
            }
        }
        ]
Was it helpful?

Solution 2

I just corrected this issue in the bundle, for 2.0 users the bundle should update within 24 hours with the correction.

OTHER TIPS

I found a solution for BBEdit that is easy and works well.

Put the following script in
~/Library/Containers/BBEdit/Data/Library/Application Support/BBEdit/Text Filters/FormatJSON.sh (on MacOS 11 Big Sur, or above)

For MacOS 10.15 Catalina and below, use this location: ~/Library/Application Support/BBEdit/Text Filters/FormatJSON.sh

#!/bin/bash
python -m json.tool
  1. Open a JSON file in BBEdit. There is no need to restart BBEdit because BBEdit rocks!
  2. Select Text > Apply Text Filter > FormatJSON

I tested this with a JSON file that had 3,612,683 characters on a single line. BBEdit opened this file and reformatted without showing a "Spinning Beachball of Death" busy-wait mouse cursor.

Solution 1: Using Python

This answer is similar to this answer, except I am using python file to do the JSON format.

  1. Exit bbedit application if it is open,
  2. put following script pretty-json.py in ~/Library/Application\ Support/BBEdit/Text\ Filters/ path
#!/usr/bin/env python
# You can change above she-bang line depending on your Mac configuration

import sys
import json

def main():
    input = sys.stdin.read()
    try:
        obj = json.loads(input)
    except Exception as e:
        print input + "\n\nERROR: " + str(e)
        return 1
    print(json.dumps(obj, indent=2))
    return 0

if __name__ == '__main__':
    sys.exit(main())
  1. To Test, open a JSON file in BBEdit.

  2. Select Text --> Apply Text Filter --> pretty-json.py

  3. If you face any issue like formatting error, then the above script will add error in New file and will not change the original JSON.
    which is not the case with this answer

Ref: https://gist.github.com/brokaw/95ade1358954cd97d0f2c8e992e14b08

For more info: Refer this

The above filter works fine for smaller JSON files, but if the JSON file is large(~ 40MB) then formatting will be slow.

To solve this, use the following solution

Solution 2: Using jq

For faster json formatting,

  1. install jq brew install jq
  2. Add fast-json-pretty.sh file in same as above file location
  3. restart bbedit.
#!/bin/bash
 jq

According to http://jsonprettyprint.com/ Textmate and Sublime aren't doing the right thing.

What version of Emacs did you use?

With 24.2.1, your JSON blob indented perfectly without issues in js-mode (Emac's default javascript major-mode).


If you do any significant Javascript development I recommend checkint out js2-mode https://github.com/mooz/js2-mode, which turns Emacs into a great JS IDE.

Sublime Pretty JSON

Sublime Pretty JSON indents the first { well. This is what I get:

[
  {
    "settings": [
      "master"
    ],
    "appPort": "8666",
    "specs": {
      "frame": {
        "type": "HTMLFrameMojit",
        "config": {
          "deploy": true,
          "child": {
            "type": "HelloWorldMojit"
          },
          "assets": {
            "top": {
              "css": [
                "/static/HelloWorldMojit/assets/index.css"
              ]
            }
          }
        }
      }
    }
  },
  {
    "settings": [
      "environment:development"
    ],
    "staticHandling": {
      "forceUpdate": true
    }
  }
]

Installation

Within Sublime Text 2: Preference => Package Control => Install Package => "Pretty Json" => Restart Sublime => Select JSON Text => Press:

  • Linux: ctrl+alt+j
  • Windows: ctrl+alt+j
  • OS X: cmd+ctrl+j

This is a solution simply using Google Chrome or NodeJS itself, and here is how:

Just open up the Google Chrome dev tool or NodeJS prompt, and type in

obj = 

and copy and paste the object into it, so it will be like

obj = [
      { 
        // etc

Now, in Google Chrome, just type

JSON.stringify(obj, null, 4)

and you will have the formatted JSON. In NodeJS, since it prints out the \n verbatim, you can use

console.log(JSON.stringify(obj, null, 4))

If you want the indentation to be just 2 spaces, just use 2 instead of 4.

If you want the indentation to be tabs instead of spaces, simply use

JSON.stringify(obj, null, "\t")
  1. Create a script file fast-json-pretty.sh in ~/Library/Application\ Support/BBEdit/Text\ Filters/
  2. Insert the following script:
#!/usr/bin/env bash
/usr/local/bin/jq .
  1. Apply the text filter as follows: Menu bar --> Text --> Apply Text Filter --> fast-json-pretty

This is a reworked version of DKB's version of his JQ script as it, at least for me, required the full path and a dot (.) at the end to make this work.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top