In Visual Studio Code (under Windows), my present Json files are displayed as the following :
I would them to be formatted as displayed below :
2
-
9Ctrl-Shift-P -> format document?HolyBlackCat– HolyBlackCat2022-01-16 08:15:07 +00:00Commented Jan 16, 2022 at 8:15
-
1Note) 'Format Document' (Shift+Alt+F in Windows) in vscode "actually" modifies the content of the file. I mean, this is not just showing indented content for readability without modifying the actual content of the json file.starriet 차주녕– starriet 차주녕2024-04-22 12:52:26 +00:00Commented Apr 22, 2024 at 12:52
Add a comment
|
10 Answers
Use ALT-SHIFT-F to auto format a json file in windows
Comments
Open the json file and SHIFT + OPTION + F for mac
Comments
In 2022 it's Ctrl+Shift+I as stated on the Visual Studio Code website.
1 Comment
Marcin
Works in VSCodium as well.
RIGHT CLICK and Select Source Action then JSON file will be converted to JSON format
Comments
Press Ctrl-Shift-p to format the documents. I don't know if this shortcut works on Windows, but it does on Linux.
1 Comment
Space
No, it doesn't. I was trying to process a step in a tutorial where the author works on Mac. I will also try later to find an extension for the right format.
If you need to setup the formatting to be consistent on every project you work, you can create a .vscode directory on the project root, create a settings.json file inside the .vscode directory.
To format JSON files you can add the following json to the settings.json file.
{
"[json]": {
"editor.defaultFormatter": "vscode.json-language-features",
"editor.tabSize": 2,
"editor.formatOnSave": true,
"editor.insertSpaces": true,
"editor.detectIndentation": false,
}
}
This would format the file when you save it. You can set tabSize to whatever size you prefer. insertSpace would add spaces instead of tabs when you use tabs. detectIndentation would ignore the current file indentation method and will stick to your specific settings.
Comments
On your Mac, you can do so by pressing command+shift+p and then type or select "JSON: Sort Document"
Comments
Install a code formatting extension then save the file.
1 Comment
Community
Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center.
Install Prettier using the extensions, and then right click, select format document with and pick Prettier.
Comments
For MacOS, if shortcuts didn't worked there might be conflicts between the formatters plugins. Try
select the code -> right click -> choose format selection
