Table of contents
The Problem
If you have unformatted or minified JSON data it is common to want to produce a more readable format of the JSON data. The minified/unformatted data usually comes in the form of an HTTP response. Unformatted JSON objects are harder to read, troubleshoot and manage.
Formatted JSON is better for code quality, organization and efficiency.
Just do it!!
Common Steps to Reproduce and Setup
Formatting from an existing file
Right-click and select the “Format Document” option (or use the keyboard shortcuts shown below in The Solution).
Formatting from the clipboard
Press Ctrl +N or select File -> New Text File from the application menu to open a new/unsaved file, and paste the chunk of JSON into it. Press Ctrl +Shift+ P , start typing “Change“, then select “Change Language Mode“:
Then, start typing “JSON” and select it when it comes up:
The Solution
Code formatting is available in Visual Studio Code through the following shortcuts:
- On Windows:
- On Mac:
- On Linux:
You can also find the shortcut along with other shortcuts through the submenu View / Command Pallete , also provided in the editor with Ctrl +Shift+ P (or Command + Shift + P on Mac) and then searching for format document.
For Unsaved Snippets
- Open command palette (Win: F1 or Ctrl+Shift+P)
- Find “Change Language Mode”
- Select language e.g.
json. By now syntax should be highlighted. - Format document (e.g. Open Command Palette -> “Format Document“)
Unformat
- Select text
- Command Palette -> Join Lines
Bug Resolution Process Developers Love
Every bug added to your teams backlog in real-time.
-
Better Team Collaboration
-
Reproduction Steps
-
Actionable Insights
-
End to End Tracing
