Editing JSON with Visual Studio Code

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="awa-expId" content="vscw_aaflight1016_treatment:103440;" /> <meta name="awa-env" content="prod" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="google-site-verification" content="hNs7DXrTySP_X-0P_AC0WulAXvUwgSXEmgfcO2r79dw" />  <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:site" content="@code" /> <meta name="description" content="Edit JSON files in Visual Studio Code" /> <meta name="keywords" content="" /> <meta name="ms.prod" content="vs-code" /> <meta name="ms.TOCTitle" content="" /> <meta name="ms.ContentId" content="FB3B14D9-A59A-4968-ACFC-5FB5D4E9B70E" /> <meta name="ms.date" content="02/06/2025" /> <meta name="ms.topic" content="conceptual" />  <meta name="twitter:card" content="summary_large_image" /> <meta property="og:url" content="https://code.visualstudio.com/docs/languages/json" /> <meta property="og:type" content="article" /> <meta property="og:title" content="Editing JSON with Visual Studio Code" /> <meta property="og:description" content="Edit JSON files in Visual Studio Code" /> <meta property="og:image" content="https://code.visualstudio.com/opengraphimg/opengraph-docs.png" /> <link rel="shortcut icon" href="/assets/favicon.ico" sizes="128x128" /> <link rel="apple-touch-icon" href="/assets/apple-touch-icon.png"> <title>Editing JSON with Visual Studio Code</title> <link rel="stylesheet" href="/vendor/bootstrap/css/bootstrap.min.css"> <link rel="stylesheet" href="/dist/v2/style.css"> <script src="https://consentdeliveryfd.azurefd.net/mscc/lib/v2/wcp-consent.js"></script> <script type="text/javascript" src="https://js.monitor.azure.com/scripts/c/ms.analytics-web-4.min.js"></script> <script type="text/javascript"> // Leave as var; siteConsent is initialized and referenced elsewhere. var siteConsent = null; const GPC_DataSharingOptIn = false; WcpConsent.onInitCallback(function () { window.appInsights = new oneDS.ApplicationInsights(); window.appInsights.initialize({ instrumentationKey: "1a3eb3104447440391ad5f2a6ee06a0a-62879566-bc58-4741-9650-302bf2af703f-7103", propertyConfiguration: { userConsented: false, gpcDataSharingOptIn: false, callback: { userConsentDetails: siteConsent ? siteConsent.getConsent : undefined }, }, cookieCfg: { ignoreCookies: ["MSCC"] }, webAnalyticsConfiguration:{ // Web Analytics Plugin configuration urlCollectQuery: true, urlCollectHash: true, autoCapture: { scroll: true, pageView: true, onLoad: true, onUnload: true, click: true, resize: true, jsError: true } } }, []); window.appInsights.getPropertyManager().getPropertiesContext().web.gpcDataSharingOptIn = GPC_DataSharingOptIn; }); </script> <link rel="alternate" type="application/atom+xml" title="RSS Feed for code.visualstudio.com" href="/feed.xml" /> </head> <body >  <script> function setTheme(themeName) { if (themeName === 'dark') { document.documentElement.removeAttribute('data-theme'); // dark is default, so no data-theme attribute needed } if (themeName === 'light') { document.documentElement.setAttribute('data-theme', themeName); } return; } // Determine initial theme: user preference or system preference let theme = localStorage.getItem('theme') || (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'); setTheme(theme); // Apply the initial theme // Listen for changes in the system theme preference window.matchMedia('(prefers-color-scheme: dark)').addListener(e => { if (!localStorage.getItem('theme')) { // Only if no user preference is saved setTheme(e.matches ? 'dark' : 'light'); } }); </script> <div id="main"> <div class="navbar-fixed-container"> <div class="navbar navbar-inverse navbar-fixed-top " data-spy="affix" data-offset-top="1"> <div id='cookie-banner'></div> <nav role="navigation" aria-label="Top Level"> <div class="container"> <div class="nav navbar-header"> <a class="navbar-brand" href="/"><span>Visual Studio Code</span></a> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse" aria-label="Expand and Collapse Menu"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav navbar-left"> <li class="active" ><a id="nav-docs" href="/docs">Docs</a></li> <li ><a id="nav-updates" href="/updates">Updates</a></li> <li ><a id="nav-blogs" href="/blogs">Blog</a></li> <li ><a id="nav-extend" href="/api">API</a></li> <li><a href="https://marketplace.visualstudio.com/VSCode" target="_blank" rel="noopener" id="nav-extensions">Extensions</a></li> <li ><a id="nav-faqs" href="/docs/supporting/faq">FAQ</a></li> <li class='search visible-xs visible-sm' ><a href="/Search">Search</a></li> <li ><a id="nav-copilot" href="/docs/copilot/overview">GitHub Copilot</a></li> </ul> </ul> <ul class="nav navbar-nav navbar-right" role="presentation"> <li> <button type="button" class="theme-switch" id="theme-toggle"> <img class="theme-icon-light" src="/assets/icons/theme-light.svg" alt="Switch to the dark theme" /> <img class="theme-icon-dark" src="/assets/icons/theme-dark.svg" alt="Switch to the light theme" /> </button> </li> <li> <a href="/Search" title="Search" class="btn search-btn" id="nav-search"> <img class="search-icon-light" src="/assets/icons/search.svg" width="16px" height="16px" alt="Search" /> <img class="search-icon-dark" src="/assets/icons/search-dark.svg" width="16px" height="16px" alt="Search" /> </a> </li> <li class="search" role="presentation"> <form class="nav-search search-form" role="search" aria-label="Search"> <div class="input-group" role="presentation"> <input type="text" name="q" class="search-box form-control" placeholder="Search Docs" aria-label="Search text"/> <span class="input-group-btn"> <button tabindex="0" class="btn" type="submit" aria-label="Search"> <img class="search-icon-dark" src="/assets/icons/search-dark.svg" alt="Search" /> <img class="search-icon-light" src="/assets/icons/search.svg" alt="Search" /> </button> </span> </div> </form> </li>  <li><a class="link-button" href="/Download" id="nav-download"> <span>Download</span></a></li> </ul> </div> </div> </nav> </div> </div> <div class="updates-banner "> <div class="container"> <p class="message">馃殌 Get <a class="copilot-deep-link" href="vscode://github.copilot-chat?referrer=vscode-updatebanner" id="banner-link-updates" rel="noopener">GitHub Copilot Free</a> in VS Code!</p> </div> <div tabindex="0" role="button" title="Dismiss this update" class="dismiss-btn" id="banner-dismiss-btn"><span class="sr-only">Dismiss this update</span><span aria-hidden="true" class="glyph-icon"></span></div> </div>   <div id="main-content"> <script> function closeReportIssue() { var element = document.getElementById('surveypopup'); element.parentElement.removeChild(element); } function reportIssue(tutorial, page) { var div = document.createElement('div'); div.innerHTML = '<div id="surveypopup" class="overlay visible"><div class="surveypopup"><div id="surveytitle">Tell us more<a href="javascript:void(0)" onclick="closeReportIssue()">X</a></div><div id="surveydiv"><iframe frameBorder="0" scrolling="0" src="https://www.research.net/r/PWZWZ52?tutorial=' + tutorial + '&step=' + page + '"></iframe></div></div></div>'; document.body.appendChild(div.children[0]); } </script> <div class="container body-content docs"> <div class="row">  <div class="col-xs-12 col-md-2 docs-navbar-container"> <nav id="docs-navbar" aria-label="Topics" class="docs-nav visible-md visible-lg"> <ul class="nav" id="main-nav"> <li > <a class="docs-home" href="/docs" >Overview</a> </li> <li class="panel collapsed"> <a class="area" role="button" href="#setup-articles" data-parent="#main-nav" data-toggle="collapse">Setup</a> <ul id="setup-articles" class="collapse "> <li > <a href="/docs/setup/setup-overview" >Overview</a> </li> <li > <a href="/docs/setup/linux" >Linux</a> </li> <li > <a href="/docs/setup/mac" >macOS</a> </li> <li > <a href="/docs/setup/windows" >Windows</a> </li> <li > <a href="/docs/setup/raspberry-pi" >Raspberry Pi</a> </li> <li > <a href="/docs/setup/network" >Network</a> </li> <li > <a href="/docs/setup/additional-components" >Additional Components</a> </li> <li > <a href="/docs/setup/enterprise" >Enterprise</a> </li> <li > <a href="/docs/setup/uninstall" >Uninstall</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#getstarted-articles" data-parent="#main-nav" data-toggle="collapse">Getting Started</a> <ul id="getstarted-articles" class="collapse "> <li > <a href="/docs/getstarted/getting-started" >Tutorial</a> </li> <li > <a href="/docs/getstarted/copilot-quickstart" >Copilot Quickstart</a> </li> <li > <a href="/docs/getstarted/introvideos" >Intro Videos</a> </li> <li > <a href="/docs/getstarted/userinterface" >User Interface</a> </li> <li > <a href="/docs/getstarted/tips-and-tricks" >Tips and Tricks</a> </li> <li > <a href="/docs/getstarted/themes" >Themes</a> </li> <li > <a href="/docs/getstarted/settings" >Settings</a> </li> <li > <a href="/docs/getstarted/keybindings" >Keyboard Shortcuts</a> </li> <li > <a href="/docs/getstarted/locales" >Display Language</a> </li> <li > <a href="/docs/getstarted/telemetry" >Telemetry</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#editor-articles" data-parent="#main-nav" data-toggle="collapse">User Guide</a> <ul id="editor-articles" class="collapse "> <li > <a href="/docs/editor/codebasics" >Basic Editing</a> </li> <li > <a href="/docs/editor/extension-marketplace" >Extension Marketplace</a> </li> <li > <a href="/docs/editor/extension-runtime-security" >Extension Runtime Security</a> </li> <li > <a href="/docs/editor/intellisense" >IntelliSense</a> </li> <li > <a href="/docs/editor/editingevolved" >Code Navigation</a> </li> <li > <a href="/docs/editor/refactoring" >Refactoring</a> </li> <li > <a href="/docs/editor/debugging" >Debugging</a> </li> <li > <a href="/docs/editor/testing" >Testing</a> </li> <li > <a href="/docs/editor/vscode-web" >VS Code for the Web</a> </li> <li > <a href="/docs/editor/tasks" >Tasks</a> </li> <li > <a href="/docs/editor/profiles" >Profiles</a> </li> <li > <a href="/docs/editor/settings-sync" >Settings Sync</a> </li> <li > <a href="/docs/editor/userdefinedsnippets" >Snippets</a> </li> <li > <a href="/docs/editor/emmet" >Emmet</a> </li> <li > <a href="/docs/editor/command-line" >Command Line Interface</a> </li> <li class="panel collapsed"> <a class="area" role="button" href="#editor-workspaces-articles" data-parent="#editor-articles" data-toggle="collapse">Workspaces</a> <ul id="editor-workspaces-articles" class="collapse "> <li > <a href="/docs/editor/workspaces/workspaces" >Workspaces</a> </li> <li > <a href="/docs/editor/workspaces/workspace-trust" >Workspace Trust</a> </li> <li > <a href="/docs/editor/workspaces/multi-root-workspaces" >Multi-root Workspaces</a> </li> </ul> </li> <li > <a href="/docs/editor/accessibility" >Accessibility</a> </li> <li > <a href="/docs/editor/voice" >Voice Interactions</a> </li> <li > <a href="/docs/editor/custom-layout" >Custom Layout</a> </li> <li > <a href="/docs/editor/port-forwarding" >Port Forwarding</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#sourcecontrol-articles" data-parent="#main-nav" data-toggle="collapse">Source Control</a> <ul id="sourcecontrol-articles" class="collapse "> <li > <a href="/docs/sourcecontrol/overview" >Overview</a> </li> <li > <a href="/docs/sourcecontrol/intro-to-git" >Introduction to Git</a> </li> <li > <a href="/docs/sourcecontrol/github" >Collaborate on GitHub</a> </li> <li > <a href="/docs/sourcecontrol/faq" >FAQ</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#terminal-articles" data-parent="#main-nav" data-toggle="collapse">Terminal</a> <ul id="terminal-articles" class="collapse "> <li > <a href="/docs/terminal/getting-started" >Getting Started Tutorial</a> </li> <li > <a href="/docs/terminal/basics" >Terminal Basics</a> </li> <li > <a href="/docs/terminal/profiles" >Terminal Profiles</a> </li> <li > <a href="/docs/terminal/shell-integration" >Shell Integration</a> </li> <li > <a href="/docs/terminal/appearance" >Appearance</a> </li> <li > <a href="/docs/terminal/advanced" >Advanced</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#copilot-articles" data-parent="#main-nav" data-toggle="collapse">GitHub Copilot</a> <ul id="copilot-articles" class="collapse "> <li > <a href="/docs/copilot/overview" >Overview</a> </li> <li > <a href="/docs/copilot/setup" >Setup</a> </li> <li > <a href="/docs/copilot/getting-started" >Copilot Quickstart</a> </li> <li > <a href="/docs/copilot/ai-powered-suggestions" >Code Completions</a> </li> <li > <a href="/docs/copilot/copilot-chat" >Copilot Chat</a> </li> <li > <a href="/docs/copilot/getting-started-chat" >Copilot Chat Tutorial</a> </li> <li > <a href="/docs/copilot/copilot-edits" >Copilot Edits</a> </li> <li > <a href="/docs/copilot/copilot-customization" >Customizing Copilot</a> </li> <li > <a href="/docs/copilot/prompt-crafting" >Best Practices</a> </li> <li > <a href="/docs/copilot/workspace-context" >Workspace Context</a> </li> <li > <a href="/docs/copilot/copilot-vscode-features" >Copilot Cheat Sheet</a> </li> <li > <a href="/docs/copilot/copilot-settings" >Settings Reference</a> </li> <li > <a href="/docs/copilot/copilot-extensibility-overview" >Copilot Extensibility</a> </li> <li > <a href="/docs/copilot/faq" >FAQ</a> </li> </ul> </li> <li class="panel active expanded"> <a class="area" role="button" href="#languages-articles" data-parent="#main-nav" data-toggle="collapse">Languages</a> <ul id="languages-articles" class="collapse in"> <li > <a href="/docs/languages/overview" >Overview</a> </li> <li > <a href="/docs/languages/javascript" >JavaScript</a> </li> <li class="active"> <a href="/docs/languages/json" aria-label="Current Page: JSON">JSON</a> </li> <li > <a href="/docs/languages/html" >HTML</a> </li> <li > <a href="/docs/languages/css" >CSS, SCSS and Less</a> </li> <li > <a href="/docs/languages/typescript" >TypeScript</a> </li> <li > <a href="/docs/languages/markdown" >Markdown</a> </li> <li > <a href="/docs/languages/powershell" >PowerShell</a> </li> <li > <a href="/docs/languages/cpp" >C++</a> </li> <li > <a href="/docs/languages/java" >Java</a> </li> <li > <a href="/docs/languages/php" >PHP</a> </li> <li > <a href="/docs/languages/python" >Python</a> </li> <li > <a href="/docs/languages/julia" >Julia</a> </li> <li > <a href="/docs/languages/r" >R</a> </li> <li > <a href="/docs/languages/ruby" >Ruby</a> </li> <li > <a href="/docs/languages/rust" >Rust</a> </li> <li > <a href="/docs/languages/go" >Go</a> </li> <li > <a href="/docs/languages/tsql" >T-SQL</a> </li> <li > <a href="/docs/languages/csharp" >C#</a> </li> <li > <a href="/docs/languages/dotnet" >.NET</a> </li> <li > <a href="/docs/languages/polyglot" >Polyglot</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#nodejs-articles" data-parent="#main-nav" data-toggle="collapse">Node.js / JavaScript</a> <ul id="nodejs-articles" class="collapse "> <li > <a href="/docs/nodejs/working-with-javascript" >Working with JavaScript</a> </li> <li > <a href="/docs/nodejs/nodejs-tutorial" >Node.js Tutorial</a> </li> <li > <a href="/docs/nodejs/nodejs-debugging" >Node.js Debugging</a> </li> <li > <a href="/docs/nodejs/nodejs-deployment" >Deploy Node.js Apps</a> </li> <li > <a href="/docs/nodejs/browser-debugging" >Browser Debugging</a> </li> <li > <a href="/docs/nodejs/angular-tutorial" >Angular Tutorial</a> </li> <li > <a href="/docs/nodejs/reactjs-tutorial" >React Tutorial</a> </li> <li > <a href="/docs/nodejs/vuejs-tutorial" >Vue Tutorial</a> </li> <li > <a href="/docs/nodejs/debugging-recipes" >Debugging Recipes</a> </li> <li > <a href="/docs/nodejs/profiling" >Performance Profiling</a> </li> <li > <a href="/docs/nodejs/extensions" >Extensions</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#typescript-articles" data-parent="#main-nav" data-toggle="collapse">TypeScript</a> <ul id="typescript-articles" class="collapse "> <li > <a href="/docs/typescript/typescript-tutorial" >Tutorial</a> </li> <li > <a href="/docs/typescript/typescript-compiling" >Compiling</a> </li> <li > <a href="/docs/typescript/typescript-editing" >Editing</a> </li> <li > <a href="/docs/typescript/typescript-refactoring" >Refactoring</a> </li> <li > <a href="/docs/typescript/typescript-debugging" >Debugging</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#python-articles" data-parent="#main-nav" data-toggle="collapse">Python</a> <ul id="python-articles" class="collapse "> <li > <a href="/docs/python/python-quick-start" >Quick Start</a> </li> <li > <a href="/docs/python/python-tutorial" >Tutorial</a> </li> <li > <a href="/docs/python/run" >Run Python Code</a> </li> <li > <a href="/docs/python/editing" >Editing</a> </li> <li > <a href="/docs/python/linting" >Linting</a> </li> <li > <a href="/docs/python/formatting" >Formatting</a> </li> <li > <a href="/docs/python/debugging" >Debugging</a> </li> <li > <a href="/docs/python/environments" >Environments</a> </li> <li > <a href="/docs/python/testing" >Testing</a> </li> <li > <a href="/docs/python/jupyter-support-py" >Python Interactive</a> </li> <li > <a href="/docs/python/tutorial-django" >Django Tutorial</a> </li> <li > <a href="/docs/python/tutorial-fastapi" >FastAPI Tutorial</a> </li> <li > <a href="/docs/python/tutorial-flask" >Flask Tutorial</a> </li> <li > <a href="/docs/python/tutorial-create-containers" >Create Containers</a> </li> <li > <a href="/docs/python/python-on-azure" >Deploy Python Apps</a> </li> <li > <a href="/docs/python/python-web" >Python in the Web</a> </li> <li > <a href="/docs/python/settings-reference" >Settings Reference</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#java-articles" data-parent="#main-nav" data-toggle="collapse">Java</a> <ul id="java-articles" class="collapse "> <li > <a href="/docs/java/java-tutorial" >Getting Started</a> </li> <li > <a href="/docs/java/java-editing" >Navigate and Edit</a> </li> <li > <a href="/docs/java/java-refactoring" >Refactoring</a> </li> <li > <a href="/docs/java/java-linting" >Formatting and Linting</a> </li> <li > <a href="/docs/java/java-project" >Project Management</a> </li> <li > <a href="/docs/java/java-build" >Build Tools</a> </li> <li > <a href="/docs/java/java-debugging" >Run and Debug</a> </li> <li > <a href="/docs/java/java-testing" >Testing</a> </li> <li > <a href="/docs/java/java-spring-boot" >Spring Boot</a> </li> <li > <a href="/docs/java/java-tomcat-jetty" >Application Servers</a> </li> <li > <a href="/docs/java/java-on-azure" >Deploy Java Apps</a> </li> <li > <a href="/docs/java/java-gui" >GUI Applications</a> </li> <li > <a href="/docs/java/extensions" >Extensions</a> </li> <li > <a href="/docs/java/java-faq" >FAQ</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#cpp-articles" data-parent="#main-nav" data-toggle="collapse">C++</a> <ul id="cpp-articles" class="collapse "> <li > <a href="/docs/cpp/introvideos-cpp" >Intro Videos</a> </li> <li > <a href="/docs/cpp/config-linux" >GCC on Linux</a> </li> <li > <a href="/docs/cpp/config-mingw" >GCC on Windows</a> </li> <li > <a href="/docs/cpp/config-wsl" >GCC on Windows Subsystem for Linux</a> </li> <li > <a href="/docs/cpp/config-clang-mac" >Clang on macOS</a> </li> <li > <a href="/docs/cpp/config-msvc" >Microsoft C++ on Windows</a> </li> <li > <a href="/docs/cpp/build-with-cmake" >Build with CMake</a> </li> <li > <a href="/docs/cpp/cmake-linux" >CMake Tools on Linux</a> </li> <li > <a href="/docs/cpp/cmake-quickstart" >CMake Quick Start</a> </li> <li > <a href="/docs/cpp/cpp-ide" >Editing and Navigating</a> </li> <li > <a href="/docs/cpp/cpp-debug" >Debugging</a> </li> <li > <a href="/docs/cpp/launch-json-reference" >Configure Debugging</a> </li> <li > <a href="/docs/cpp/cpp-refactoring" >Refactoring</a> </li> <li > <a href="/docs/cpp/customize-default-settings-cpp" >Settings</a> </li> <li > <a href="/docs/cpp/configure-intellisense" >Configure IntelliSense</a> </li> <li > <a href="/docs/cpp/configure-intellisense-crosscompilation" >Configure IntelliSense for Cross-Compiling</a> </li> <li > <a href="/docs/cpp/faq-cpp" >FAQ</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#csharp-articles" data-parent="#main-nav" data-toggle="collapse">C#</a> <ul id="csharp-articles" class="collapse "> <li > <a href="/docs/csharp/introvideos-csharp" >Intro Videos</a> </li> <li > <a href="/docs/csharp/get-started" >Get Started</a> </li> <li > <a href="/docs/csharp/navigate-edit" >Navigate and Edit</a> </li> <li > <a href="/docs/csharp/intellicode" >IntelliCode</a> </li> <li > <a href="/docs/csharp/refactoring" >Refactoring</a> </li> <li > <a href="/docs/csharp/formatting-linting" >Formatting and Linting</a> </li> <li > <a href="/docs/csharp/project-management" >Project Management</a> </li> <li > <a href="/docs/csharp/build-tools" >Build Tools</a> </li> <li > <a href="/docs/csharp/package-management" >Package Management</a> </li> <li > <a href="/docs/csharp/debugging" >Run and Debug</a> </li> <li > <a href="/docs/csharp/testing" >Testing</a> </li> <li > <a href="/docs/csharp/cs-dev-kit-faq" >FAQ</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#containers-articles" data-parent="#main-nav" data-toggle="collapse">Docker</a> <ul id="containers-articles" class="collapse "> <li > <a href="/docs/containers/overview" >Overview</a> </li> <li > <a href="/docs/containers/quickstart-node" >Node.js</a> </li> <li > <a href="/docs/containers/quickstart-python" >Python</a> </li> <li > <a href="/docs/containers/quickstart-aspnet-core" >ASP.NET Core</a> </li> <li > <a href="/docs/containers/debug-common" >Debug</a> </li> <li > <a href="/docs/containers/docker-compose" >Docker Compose</a> </li> <li > <a href="/docs/containers/quickstart-container-registries" >Registries</a> </li> <li > <a href="/docs/containers/app-service" >Deploy to Azure</a> </li> <li > <a href="/docs/containers/choosing-dev-environment" >Choose a Dev Environment</a> </li> <li > <a href="/docs/containers/reference" >Customize</a> </li> <li > <a href="/docs/containers/bridge-to-kubernetes" >Develop with Kubernetes</a> </li> <li > <a href="/docs/containers/troubleshooting" >Tips and Tricks</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#datascience-articles" data-parent="#main-nav" data-toggle="collapse">Data Science</a> <ul id="datascience-articles" class="collapse "> <li > <a href="/docs/datascience/overview" >Overview</a> </li> <li > <a href="/docs/datascience/jupyter-notebooks" >Jupyter Notebooks</a> </li> <li > <a href="/docs/datascience/data-science-tutorial" >Data Science Tutorial</a> </li> <li > <a href="/docs/datascience/python-interactive" >Python Interactive</a> </li> <li > <a href="/docs/datascience/data-wrangler-quick-start" >Data Wrangler Quick Start</a> </li> <li > <a href="/docs/datascience/data-wrangler" >Data Wrangler</a> </li> <li > <a href="/docs/datascience/pytorch-support" >PyTorch Support</a> </li> <li > <a href="/docs/datascience/azure-machine-learning" >Azure Machine Learning</a> </li> <li > <a href="/docs/datascience/jupyter-kernel-management" >Manage Jupyter Kernels</a> </li> <li > <a href="/docs/datascience/notebooks-web" >Jupyter Notebooks on the Web</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#intelligentapps-articles" data-parent="#main-nav" data-toggle="collapse">Intelligent Apps</a> <ul id="intelligentapps-articles" class="collapse "> <li > <a href="/docs/intelligentapps/overview" >AI Toolkit Overview</a> </li> <li > <a href="/docs/intelligentapps/models" >Models</a> </li> <li > <a href="/docs/intelligentapps/playground" >Playground</a> </li> <li > <a href="/docs/intelligentapps/bulkrun" >Bulk Run</a> </li> <li > <a href="/docs/intelligentapps/evaluation" >Evaluation</a> </li> <li > <a href="/docs/intelligentapps/finetune" >Fine-tune</a> </li> <li > <a href="/docs/intelligentapps/faq" >FAQ</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#azure-articles" data-parent="#main-nav" data-toggle="collapse">Azure</a> <ul id="azure-articles" class="collapse "> <li > <a href="/docs/azure/overview" >Overview</a> </li> <li > <a href="/docs/azure/gettingstarted" >Getting Started</a> </li> <li > <a href="/docs/azure/deployment" >Deployment</a> </li> <li > <a href="/docs/azure/docker" >Docker</a> </li> <li > <a href="/docs/azure/aksextensions" >Azure Kubernetes Service</a> </li> <li > <a href="/docs/azure/kubernetes" >Kubernetes</a> </li> <li > <a href="/docs/azure/mongodb" >MongoDB</a> </li> <li > <a href="/docs/azure/remote-debugging" >Remote Debugging for Node.js</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#remote-articles" data-parent="#main-nav" data-toggle="collapse">Remote</a> <ul id="remote-articles" class="collapse "> <li > <a href="/docs/remote/remote-overview" >Overview</a> </li> <li > <a href="/docs/remote/ssh" >SSH</a> </li> <li > <a href="/docs/remote/dev-containers" >Dev Containers</a> </li> <li > <a href="/docs/remote/wsl" >Windows Subsystem for Linux</a> </li> <li > <a href="/docs/remote/codespaces" >GitHub Codespaces</a> </li> <li > <a href="/docs/remote/vscode-server" >VS Code Server</a> </li> <li > <a href="/docs/remote/tunnels" >Tunnels</a> </li> <li > <a href="/docs/remote/ssh-tutorial" >SSH Tutorial</a> </li> <li > <a href="/docs/remote/wsl-tutorial" >WSL Tutorial</a> </li> <li > <a href="/docs/remote/troubleshooting" >Tips and Tricks</a> </li> <li > <a href="/docs/remote/faq" >FAQ</a> </li> </ul> </li> <li class="panel collapsed"> <a class="area" role="button" href="#devcontainers-articles" data-parent="#main-nav" data-toggle="collapse">Dev Containers</a> <ul id="devcontainers-articles" class="collapse "> <li > <a href="/docs/devcontainers/containers" >Overview</a> </li> <li > <a href="/docs/devcontainers/tutorial" >Tutorial</a> </li> <li > <a href="/docs/devcontainers/attach-container" >Attach to Container</a> </li> <li > <a href="/docs/devcontainers/create-dev-container" >Create Dev Container</a> </li> <li > <a href="/docs/devcontainers/containers-advanced" >Advanced Containers</a> </li> <li > <a href="/docs/devcontainers/devcontainerjson-reference" >devcontainer.json</a> </li> <li > <a href="/docs/devcontainers/devcontainer-cli" >Dev Container CLI</a> </li> <li > <a href="/docs/devcontainers/tips-and-tricks" >Tips and Tricks</a> </li> <li > <a href="/docs/devcontainers/faq" >FAQ</a> </li> </ul> </li> </ul> </nav> <nav id="small-nav" aria-label="Topics" class="docs-nav hidden-md hidden-lg"> <label class="faux-h4" for="small-nav-dropdown">Topics</label> <select id="small-nav-dropdown" aria-label="topics"> <option value="/docs" >Overview</option> <optgroup label="Setup"> <option value="/docs/setup/setup-overview" >Overview</option> <option value="/docs/setup/linux" >Linux</option> <option value="/docs/setup/mac" >macOS</option> <option value="/docs/setup/windows" >Windows</option> <option value="/docs/setup/raspberry-pi" >Raspberry Pi</option> <option value="/docs/setup/network" >Network</option> <option value="/docs/setup/additional-components" >Additional Components</option> <option value="/docs/setup/enterprise" >Enterprise</option> <option value="/docs/setup/uninstall" >Uninstall</option> </optgroup> <optgroup label="Getting Started"> <option value="/docs/getstarted/getting-started" >Tutorial</option> <option value="/docs/getstarted/copilot-quickstart" >Copilot Quickstart</option> <option value="/docs/getstarted/introvideos" >Intro Videos</option> <option value="/docs/getstarted/userinterface" >User Interface</option> <option value="/docs/getstarted/tips-and-tricks" >Tips and Tricks</option> <option value="/docs/getstarted/themes" >Themes</option> <option value="/docs/getstarted/settings" >Settings</option> <option value="/docs/getstarted/keybindings" >Keyboard Shortcuts</option> <option value="/docs/getstarted/locales" >Display Language</option> <option value="/docs/getstarted/telemetry" >Telemetry</option> </optgroup> <optgroup label="User Guide"> <option value="/docs/editor/codebasics" >Basic Editing</option> <option value="/docs/editor/extension-marketplace" >Extension Marketplace</option> <option value="/docs/editor/extension-runtime-security" >Extension Runtime Security</option> <option value="/docs/editor/intellisense" >IntelliSense</option> <option value="/docs/editor/editingevolved" >Code Navigation</option> <option value="/docs/editor/refactoring" >Refactoring</option> <option value="/docs/editor/debugging" >Debugging</option> <option value="/docs/editor/testing" >Testing</option> <option value="/docs/editor/vscode-web" >VS Code for the Web</option> <option value="/docs/editor/tasks" >Tasks</option> <option value="/docs/editor/profiles" >Profiles</option> <option value="/docs/editor/settings-sync" >Settings Sync</option> <option value="/docs/editor/userdefinedsnippets" >Snippets</option> <option value="/docs/editor/emmet" >Emmet</option> <option value="/docs/editor/command-line" >Command Line Interface</option> <optgroup label="User Guide - Workspaces"> <option value="/docs/editor/workspaces/workspaces" >Workspaces</option> <option value="/docs/editor/workspaces/workspace-trust" >Workspace Trust</option> <option value="/docs/editor/workspaces/multi-root-workspaces" >Multi-root Workspaces</option> </optgroup> <option value="/docs/editor/accessibility" >Accessibility</option> <option value="/docs/editor/voice" >Voice Interactions</option> <option value="/docs/editor/custom-layout" >Custom Layout</option> <option value="/docs/editor/port-forwarding" >Port Forwarding</option> </optgroup> <optgroup label="Source Control"> <option value="/docs/sourcecontrol/overview" >Overview</option> <option value="/docs/sourcecontrol/intro-to-git" >Introduction to Git</option> <option value="/docs/sourcecontrol/github" >Collaborate on GitHub</option> <option value="/docs/sourcecontrol/faq" >FAQ</option> </optgroup> <optgroup label="Terminal"> <option value="/docs/terminal/getting-started" >Getting Started Tutorial</option> <option value="/docs/terminal/basics" >Terminal Basics</option> <option value="/docs/terminal/profiles" >Terminal Profiles</option> <option value="/docs/terminal/shell-integration" >Shell Integration</option> <option value="/docs/terminal/appearance" >Appearance</option> <option value="/docs/terminal/advanced" >Advanced</option> </optgroup> <optgroup label="GitHub Copilot"> <option value="/docs/copilot/overview" >Overview</option> <option value="/docs/copilot/setup" >Setup</option> <option value="/docs/copilot/getting-started" >Copilot Quickstart</option> <option value="/docs/copilot/ai-powered-suggestions" >Code Completions</option> <option value="/docs/copilot/copilot-chat" >Copilot Chat</option> <option value="/docs/copilot/getting-started-chat" >Copilot Chat Tutorial</option> <option value="/docs/copilot/copilot-edits" >Copilot Edits</option> <option value="/docs/copilot/copilot-customization" >Customizing Copilot</option> <option value="/docs/copilot/prompt-crafting" >Best Practices</option> <option value="/docs/copilot/workspace-context" >Workspace Context</option> <option value="/docs/copilot/copilot-vscode-features" >Copilot Cheat Sheet</option> <option value="/docs/copilot/copilot-settings" >Settings Reference</option> <option value="/docs/copilot/copilot-extensibility-overview" >Copilot Extensibility</option> <option value="/docs/copilot/faq" >FAQ</option> </optgroup> <optgroup label="Languages"> <option value="/docs/languages/overview" >Overview</option> <option value="/docs/languages/javascript" >JavaScript</option> <option value="/docs/languages/json" selected>JSON</option> <option value="/docs/languages/html" >HTML</option> <option value="/docs/languages/css" >CSS, SCSS and Less</option> <option value="/docs/languages/typescript" >TypeScript</option> <option value="/docs/languages/markdown" >Markdown</option> <option value="/docs/languages/powershell" >PowerShell</option> <option value="/docs/languages/cpp" >C++</option> <option value="/docs/languages/java" >Java</option> <option value="/docs/languages/php" >PHP</option> <option value="/docs/languages/python" >Python</option> <option value="/docs/languages/julia" >Julia</option> <option value="/docs/languages/r" >R</option> <option value="/docs/languages/ruby" >Ruby</option> <option value="/docs/languages/rust" >Rust</option> <option value="/docs/languages/go" >Go</option> <option value="/docs/languages/tsql" >T-SQL</option> <option value="/docs/languages/csharp" >C#</option> <option value="/docs/languages/dotnet" >.NET</option> <option value="/docs/languages/polyglot" >Polyglot</option> </optgroup> <optgroup label="Node.js / JavaScript"> <option value="/docs/nodejs/working-with-javascript" >Working with JavaScript</option> <option value="/docs/nodejs/nodejs-tutorial" >Node.js Tutorial</option> <option value="/docs/nodejs/nodejs-debugging" >Node.js Debugging</option> <option value="/docs/nodejs/nodejs-deployment" >Deploy Node.js Apps</option> <option value="/docs/nodejs/browser-debugging" >Browser Debugging</option> <option value="/docs/nodejs/angular-tutorial" >Angular Tutorial</option> <option value="/docs/nodejs/reactjs-tutorial" >React Tutorial</option> <option value="/docs/nodejs/vuejs-tutorial" >Vue Tutorial</option> <option value="/docs/nodejs/debugging-recipes" >Debugging Recipes</option> <option value="/docs/nodejs/profiling" >Performance Profiling</option> <option value="/docs/nodejs/extensions" >Extensions</option> </optgroup> <optgroup label="TypeScript"> <option value="/docs/typescript/typescript-tutorial" >Tutorial</option> <option value="/docs/typescript/typescript-compiling" >Compiling</option> <option value="/docs/typescript/typescript-editing" >Editing</option> <option value="/docs/typescript/typescript-refactoring" >Refactoring</option> <option value="/docs/typescript/typescript-debugging" >Debugging</option> </optgroup> <optgroup label="Python"> <option value="/docs/python/python-quick-start" >Quick Start</option> <option value="/docs/python/python-tutorial" >Tutorial</option> <option value="/docs/python/run" >Run Python Code</option> <option value="/docs/python/editing" >Editing</option> <option value="/docs/python/linting" >Linting</option> <option value="/docs/python/formatting" >Formatting</option> <option value="/docs/python/debugging" >Debugging</option> <option value="/docs/python/environments" >Environments</option> <option value="/docs/python/testing" >Testing</option> <option value="/docs/python/jupyter-support-py" >Python Interactive</option> <option value="/docs/python/tutorial-django" >Django Tutorial</option> <option value="/docs/python/tutorial-fastapi" >FastAPI Tutorial</option> <option value="/docs/python/tutorial-flask" >Flask Tutorial</option> <option value="/docs/python/tutorial-create-containers" >Create Containers</option> <option value="/docs/python/python-on-azure" >Deploy Python Apps</option> <option value="/docs/python/python-web" >Python in the Web</option> <option value="/docs/python/settings-reference" >Settings Reference</option> </optgroup> <optgroup label="Java"> <option value="/docs/java/java-tutorial" >Getting Started</option> <option value="/docs/java/java-editing" >Navigate and Edit</option> <option value="/docs/java/java-refactoring" >Refactoring</option> <option value="/docs/java/java-linting" >Formatting and Linting</option> <option value="/docs/java/java-project" >Project Management</option> <option value="/docs/java/java-build" >Build Tools</option> <option value="/docs/java/java-debugging" >Run and Debug</option> <option value="/docs/java/java-testing" >Testing</option> <option value="/docs/java/java-spring-boot" >Spring Boot</option> <option value="/docs/java/java-tomcat-jetty" >Application Servers</option> <option value="/docs/java/java-on-azure" >Deploy Java Apps</option> <option value="/docs/java/java-gui" >GUI Applications</option> <option value="/docs/java/extensions" >Extensions</option> <option value="/docs/java/java-faq" >FAQ</option> </optgroup> <optgroup label="C++"> <option value="/docs/cpp/introvideos-cpp" >Intro Videos</option> <option value="/docs/cpp/config-linux" >GCC on Linux</option> <option value="/docs/cpp/config-mingw" >GCC on Windows</option> <option value="/docs/cpp/config-wsl" >GCC on Windows Subsystem for Linux</option> <option value="/docs/cpp/config-clang-mac" >Clang on macOS</option> <option value="/docs/cpp/config-msvc" >Microsoft C++ on Windows</option> <option value="/docs/cpp/build-with-cmake" >Build with CMake</option> <option value="/docs/cpp/cmake-linux" >CMake Tools on Linux</option> <option value="/docs/cpp/cmake-quickstart" >CMake Quick Start</option> <option value="/docs/cpp/cpp-ide" >Editing and Navigating</option> <option value="/docs/cpp/cpp-debug" >Debugging</option> <option value="/docs/cpp/launch-json-reference" >Configure Debugging</option> <option value="/docs/cpp/cpp-refactoring" >Refactoring</option> <option value="/docs/cpp/customize-default-settings-cpp" >Settings</option> <option value="/docs/cpp/configure-intellisense" >Configure IntelliSense</option> <option value="/docs/cpp/configure-intellisense-crosscompilation" >Configure IntelliSense for Cross-Compiling</option> <option value="/docs/cpp/faq-cpp" >FAQ</option> </optgroup> <optgroup label="C#"> <option value="/docs/csharp/introvideos-csharp" >Intro Videos</option> <option value="/docs/csharp/get-started" >Get Started</option> <option value="/docs/csharp/navigate-edit" >Navigate and Edit</option> <option value="/docs/csharp/intellicode" >IntelliCode</option> <option value="/docs/csharp/refactoring" >Refactoring</option> <option value="/docs/csharp/formatting-linting" >Formatting and Linting</option> <option value="/docs/csharp/project-management" >Project Management</option> <option value="/docs/csharp/build-tools" >Build Tools</option> <option value="/docs/csharp/package-management" >Package Management</option> <option value="/docs/csharp/debugging" >Run and Debug</option> <option value="/docs/csharp/testing" >Testing</option> <option value="/docs/csharp/cs-dev-kit-faq" >FAQ</option> </optgroup> <optgroup label="Docker"> <option value="/docs/containers/overview" >Overview</option> <option value="/docs/containers/quickstart-node" >Node.js</option> <option value="/docs/containers/quickstart-python" >Python</option> <option value="/docs/containers/quickstart-aspnet-core" >ASP.NET Core</option> <option value="/docs/containers/debug-common" >Debug</option> <option value="/docs/containers/docker-compose" >Docker Compose</option> <option value="/docs/containers/quickstart-container-registries" >Registries</option> <option value="/docs/containers/app-service" >Deploy to Azure</option> <option value="/docs/containers/choosing-dev-environment" >Choose a Dev Environment</option> <option value="/docs/containers/reference" >Customize</option> <option value="/docs/containers/bridge-to-kubernetes" >Develop with Kubernetes</option> <option value="/docs/containers/troubleshooting" >Tips and Tricks</option> </optgroup> <optgroup label="Data Science"> <option value="/docs/datascience/overview" >Overview</option> <option value="/docs/datascience/jupyter-notebooks" >Jupyter Notebooks</option> <option value="/docs/datascience/data-science-tutorial" >Data Science Tutorial</option> <option value="/docs/datascience/python-interactive" >Python Interactive</option> <option value="/docs/datascience/data-wrangler-quick-start" >Data Wrangler Quick Start</option> <option value="/docs/datascience/data-wrangler" >Data Wrangler</option> <option value="/docs/datascience/pytorch-support" >PyTorch Support</option> <option value="/docs/datascience/azure-machine-learning" >Azure Machine Learning</option> <option value="/docs/datascience/jupyter-kernel-management" >Manage Jupyter Kernels</option> <option value="/docs/datascience/notebooks-web" >Jupyter Notebooks on the Web</option> </optgroup> <optgroup label="Intelligent Apps"> <option value="/docs/intelligentapps/overview" >AI Toolkit Overview</option> <option value="/docs/intelligentapps/models" >Models</option> <option value="/docs/intelligentapps/playground" >Playground</option> <option value="/docs/intelligentapps/bulkrun" >Bulk Run</option> <option value="/docs/intelligentapps/evaluation" >Evaluation</option> <option value="/docs/intelligentapps/finetune" >Fine-tune</option> <option value="/docs/intelligentapps/faq" >FAQ</option> </optgroup> <optgroup label="Azure"> <option value="/docs/azure/overview" >Overview</option> <option value="/docs/azure/gettingstarted" >Getting Started</option> <option value="/docs/azure/deployment" >Deployment</option> <option value="/docs/azure/docker" >Docker</option> <option value="/docs/azure/aksextensions" >Azure Kubernetes Service</option> <option value="/docs/azure/kubernetes" >Kubernetes</option> <option value="/docs/azure/mongodb" >MongoDB</option> <option value="/docs/azure/remote-debugging" >Remote Debugging for Node.js</option> </optgroup> <optgroup label="Remote"> <option value="/docs/remote/remote-overview" >Overview</option> <option value="/docs/remote/ssh" >SSH</option> <option value="/docs/remote/dev-containers" >Dev Containers</option> <option value="/docs/remote/wsl" >Windows Subsystem for Linux</option> <option value="/docs/remote/codespaces" >GitHub Codespaces</option> <option value="/docs/remote/vscode-server" >VS Code Server</option> <option value="/docs/remote/tunnels" >Tunnels</option> <option value="/docs/remote/ssh-tutorial" >SSH Tutorial</option> <option value="/docs/remote/wsl-tutorial" >WSL Tutorial</option> <option value="/docs/remote/troubleshooting" >Tips and Tricks</option> <option value="/docs/remote/faq" >FAQ</option> </optgroup> <optgroup label="Dev Containers"> <option value="/docs/devcontainers/containers" >Overview</option> <option value="/docs/devcontainers/tutorial" >Tutorial</option> <option value="/docs/devcontainers/attach-container" >Attach to Container</option> <option value="/docs/devcontainers/create-dev-container" >Create Dev Container</option> <option value="/docs/devcontainers/containers-advanced" >Advanced Containers</option> <option value="/docs/devcontainers/devcontainerjson-reference" >devcontainer.json</option> <option value="/docs/devcontainers/devcontainer-cli" >Dev Container CLI</option> <option value="/docs/devcontainers/tips-and-tricks" >Tips and Tricks</option> <option value="/docs/devcontainers/faq" >FAQ</option> </optgroup> </select> </nav> </div>  <div class="col-xs-12 visible-xs"> <nav aria-labelledby="small-right-nav-label" class="small-nav docs-nav updates-nav"> <label class="faux-h4" for="small-right-nav-dropdown" id="small-right-nav-label">In this article</label> <select id="small-right-nav-dropdown" class="small-nav-select" aria-label="Sections"> <option value="#_intellisense-and-validation">IntelliSense and validation</option> <option value="#_quick-navigation">Quick navigation</option> <option value="#_hovers">Hovers</option> <option value="#_formatting">Formatting</option> <option value="#_folding">Folding</option> <option value="#_json-with-comments">JSON with Comments</option> <option value="#_json-schemas-and-settings">JSON schemas and settings</option> </select> </nav> </div>  <main class="col-xs-12 col-sm-9 col-md-8 body"> <div class="edit-github pull-right"> <a href="https://vscode.dev/github/microsoft/vscode-docs/blob/main/docs/languages/json.md" class="btn btn-default" title="Edit this document in vscode.dev"> <span class="glyphicon glyphicon-pencil"></span> <span class="hidden-xs">Edit</span> </a> </div> <h1>Editing JSON with Visual Studio Code</h1> <p>JSON is a data format that is common in configuration files like <code>package.json</code> or <code>project.json</code>. We also use it extensively in Visual Studio Code for our configuration files. When opening a file that ends with <code>.json</code>, VS Code provides features to make it simpler to write or modify the file's content.</p> <p><img src="/assets/docs/languages/json/json_hero.png" alt="JSON within VS Code" loading="lazy"></p> <h2 id="_intellisense-and-validation" data-needslink="_intellisense-and-validation">IntelliSense and validation</h2> <p>For properties and values, both for JSON data with or without a schema, we offer up suggestions as you type with IntelliSense. You can also manually see suggestions with the <strong>Trigger Suggestions</strong> command (<span class="dynamic-keybinding" data-commandId="editor.action.triggerSuggest" data-osx="鈱僑pace" data-win="Ctrl+Space" data-linux="Ctrl+Space"><span class="keybinding">鈱僑pace</span> (Windows, Linux <span class="keybinding">Ctrl+Space</span>)</span>).</p> <p>We also perform structural and value verification based on an associated JSON schema giving you red squiggles. To disable validation, use the <span class="setting"><a href="vscode://settings/json.validate.enable" codesetting="true"><span class="codicon codicon-settings-gear dynamic-setting-icon" title="Open 'json.validate.enable' in Settings Editor"></span></a>json.validate.enable</span> <a href="/docs/getstarted/settings">setting</a>.</p> <p><img src="/assets/docs/languages/json/intellisense.png" alt="IntelliSense" loading="lazy"></p> <h3 id="_package-and-project-dependencies" data-needslink="_package-and-project-dependencies">Package and project dependencies</h3> <p>We also offer IntelliSense for specific value sets such as package and project dependencies in <code>package.json</code>, <code>project.json</code>, and <code>bower.json</code>.</p> <h2 id="_quick-navigation" data-needslink="_quick-navigation">Quick navigation</h2> <p>JSON files can get large and we support quick navigation to properties using the <strong>Go to Symbol</strong> command (<span class="dynamic-keybinding" data-commandId="workbench.action.gotoSymbol" data-osx="鈬р寴O" data-win="Ctrl+Shift+O" data-linux="Ctrl+Shift+O"><span class="keybinding">鈬р寴O</span> (Windows, Linux <span class="keybinding">Ctrl+Shift+O</span>)</span>).</p> <p><img src="/assets/docs/languages/json/gotosymbol.png" alt="Goto Symbol" loading="lazy"></p> <h2 id="_hovers" data-needslink="_hovers">Hovers</h2> <p>When you hover over properties and values for JSON data with or without schema, we will provide additional context.</p> <p><img src="/assets/docs/languages/json/hoverandtoggle.png" alt="Hover" loading="lazy"></p> <h2 id="_formatting" data-needslink="_formatting">Formatting</h2> <p>You can format your JSON document using <span class="dynamic-keybinding" data-commandId="editor.action.formatDocument" data-osx="鈬р尌F" data-win="Shift+Alt+F" data-linux="Ctrl+Shift+I"><span class="keybinding">鈬р尌F</span> (Windows <span class="keybinding">Shift+Alt+F</span>, Linux <span class="keybinding">Ctrl+Shift+I</span>)</span> or <strong>Format Document</strong> from the context menu.</p> <h2 id="_folding" data-needslink="_folding">Folding</h2> <p>You can fold regions of source code using the folding icons on the gutter between line numbers and line start. Folding regions are available for all object and array elements.</p> <h2 id="_json-with-comments" data-needslink="_json-with-comments">JSON with Comments</h2> <p>In addition to the default JSON mode following the <a href="https://www.json.org/" class="external-link" target="_blank">JSON specification</a>, VS Code also has a <strong>JSON with Comments</strong> (jsonc) mode. This mode is used for the VS Code configuration files such as <code>settings.json</code>, <code>tasks.json</code>, or <code>launch.json</code>. When in the <strong>JSON with Comments</strong> mode, you can use single line (<code>//</code>) as well as block comments (<code>/* */</code>) as used in JavaScript. The mode also accepts trailing commas, but they are discouraged and the editor will display a warning.</p> <p>The current editor mode is indicated in the editor's Status Bar. Select the mode indicator to change the mode and to configure how file extensions are associated to modes. You can also directly modify the <span class="setting"><a href="vscode://settings/files.associations" codesetting="true"><span class="codicon codicon-settings-gear dynamic-setting-icon" title="Open 'files.associations' in Settings Editor"></span></a>files.associations</span> <a href="/docs/languages/overview#_add-a-file-extension-to-a-language">setting</a> to associate file names or file name patterns to <code>jsonc</code>.</p> <h2 id="_json-schemas-and-settings" data-needslink="_json-schemas-and-settings">JSON schemas and settings</h2> <p>To understand the structure of JSON files, we use <a href="https://json-schema.org/" class="external-link" target="_blank">JSON schemas</a>. JSON schemas describe the shape of the JSON file, as well as value sets, default values, and descriptions. The JSON support shipped with VS Code supports all draft versions from draft 4 to draft 7, with limited support for drafts 2019-09 and 2020-12.</p> <p>Servers like <a href="https://www.schemastore.org" class="external-link" target="_blank">JSON Schema Store</a> provide schemas for most of the common JSON-based configuration files. However, schemas can also be defined in a file in the VS Code workspace, as well as the VS Code settings files.</p> <p>The association of a JSON file to a schema can be done either in the JSON file itself using the <code>$schema</code> attribute, or in the User or Workspace <a href="/docs/getstarted/settings">settings</a> (<span class="filePreferencesPath"><strong>File</strong> > <strong>Preferences</strong></span> > <strong>Settings</strong>) under the property <span class="setting"><a href="vscode://settings/json.schemas" codesetting="true"><span class="codicon codicon-settings-gear dynamic-setting-icon" title="Open 'json.schemas' in Settings Editor"></span></a>json.schemas</span>.</p> <p>VS Code extensions can also define schemas and schema mapping. That's why VS Code already knows about the schema of some well-known JSON files such as <code>package.json</code>, <code>bower.json</code>, and <code>tsconfig.json</code>.</p> <h3 id="_mapping-in-the-json" data-needslink="_mapping-in-the-json">Mapping in the JSON</h3> <p>In the following example, the JSON file specifies that its contents follow the <a href="https://coffeelint.github.io/" class="external-link" target="_blank">CoffeeLint</a> schema.</p> <pre class="shiki" style="background-color: #1e1e1e"><code><span class="line"><span style="color: #BBBBBB">{</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"$schema"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"https://json.schemastore.org/coffeelint"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"line_endings"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"unix"</span></span> <span class="line"><span style="color: #BBBBBB">}</span></span> <span class="line"></span></code></pre> <p>Note that this syntax is VS Code-specific and not part of the <a href="https://json-schema.org/specification" class="external-link" target="_blank">JSON Schema specification</a>. Adding the <code>$schema</code> key changes the JSON itself, which systems consuming the JSON might not expect, for example, schema validation might fail. If this is the case, you can use one of the other mapping methods.</p> <h3 id="_mapping-in-the-user-settings" data-needslink="_mapping-in-the-user-settings">Mapping in the User Settings</h3> <p>The following excerpt from User <a href="/docs/getstarted/settings">Settings</a> shows how <code>.babelrc</code> files are mapped to the <a href="https://babeljs.io/docs/usage/babelrc" class="external-link" target="_blank">babelrc</a> schema located on <a href="https://json.schemastore.org/babelrc" class="external-link" target="_blank">https://json.schemastore.org/babelrc</a>.</p> <pre class="shiki" style="background-color: #1e1e1e"><code><span class="line"><span style="color: #CE9178">"json.schemas"</span><span style="color: #BBBBBB">: [</span></span> <span class="line"><span style="color: #BBBBBB"> {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"fileMatch"</span><span style="color: #BBBBBB">: [</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #CE9178">"/.babelrc"</span></span> <span class="line"><span style="color: #BBBBBB"> ],</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"url"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"https://json.schemastore.org/babelrc"</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB">]</span></span> <span class="line"></span></code></pre> <blockquote><p><strong>Tip:</strong> In addition to defining a schema for <code>.babelrc</code>, also make sure that <code>.babelrc</code> is associated to the JSON language mode. This is also done in the settings using the <code>files.association</code> array setting.</p> </blockquote><h3 id="_mapping-to-a-schema-in-the-workspace" data-needslink="_mapping-to-a-schema-in-the-workspace">Mapping to a schema in the workspace</h3> <p>To map a schema that is located in the workspace, use a relative path. In this example, a file in the workspace root called <code>myschema.json</code> will be used as the schema for all files ending with <code>.foo.json</code>.</p> <pre class="shiki" style="background-color: #1e1e1e"><code><span class="line"><span style="color: #CE9178">"json.schemas"</span><span style="color: #BBBBBB">: [</span></span> <span class="line"><span style="color: #BBBBBB"> {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"fileMatch"</span><span style="color: #BBBBBB">: [</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #CE9178">"**/*.foo.json"</span></span> <span class="line"><span style="color: #BBBBBB"> ],</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"url"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"./myschema.json"</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB">]</span></span> <span class="line"></span></code></pre> <h3 id="_mapping-to-a-schema-defined-in-settings" data-needslink="_mapping-to-a-schema-defined-in-settings">Mapping to a schema defined in settings</h3> <p>To map a schema that is defined in the User or Workspace settings, use the <code>schema</code> property. In this example, a schema is defined that will be used for all files named <code>.myconfig</code>.</p> <pre class="shiki" style="background-color: #1e1e1e"><code><span class="line"><span style="color: #CE9178">"json.schemas"</span><span style="color: #BBBBBB">: [</span></span> <span class="line"><span style="color: #BBBBBB"> {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"fileMatch"</span><span style="color: #BBBBBB">: [</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #CE9178">"/.myconfig"</span></span> <span class="line"><span style="color: #BBBBBB"> ],</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"schema"</span><span style="color: #BBBBBB">: {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"type"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"object"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"properties"</span><span style="color: #BBBBBB">: {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"name"</span><span style="color: #BBBBBB"> : {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"type"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"string"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"description"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"The name of the entry"</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB">]</span></span> <span class="line"></span></code></pre> <h3 id="_mapping-a-schema-in-an-extension" data-needslink="_mapping-a-schema-in-an-extension">Mapping a schema in an extension</h3> <p>Schemas and schema associations can also be defined by an extension. Check out the <a href="/api/references/contribution-points#_contributesjsonvalidation">jsonValidation contribution point</a>.</p> <h3 id="_file-match-syntax" data-needslink="_file-match-syntax">File match syntax</h3> <p>The file match syntax supports the '*' wildcard. Also, you can define exclusion patterns, starting with '!'. For an association to match, at least one pattern needs to match and the last matching pattern must not be an exclusion pattern.</p> <pre class="shiki" style="background-color: #1e1e1e"><code><span class="line"><span style="color: #BBBBBB"> </span><span style="color: #CE9178">"json.schemas"</span><span style="color: #BBBBBB">: [</span></span> <span class="line"><span style="color: #BBBBBB"> {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"fileMatch"</span><span style="color: #BBBBBB">: [</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #CE9178">"/receipts/*.json"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #CE9178">"!/receipts/*.excluded.json"</span></span> <span class="line"><span style="color: #BBBBBB"> ],</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"url"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"./receipts.schema.json"</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB"> ]</span></span> <span class="line"></span></code></pre> <h3 id="_define-snippets-in-json-schemas" data-needslink="_define-snippets-in-json-schemas">Define snippets in JSON schemas</h3> <p>JSON schemas describe the shape of the JSON file, as well as value sets and default values, which are used by the JSON language support to provide completion proposals. If you are a schema author and want to provide even more customized completion proposals, you can also specify snippets in the schema.</p> <p>The following example shows a schema for a keyboard shortcut settings file defining a snippet:</p> <pre class="shiki" style="background-color: #1e1e1e"><code><span class="line"><span style="color: #BBBBBB">{</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"type"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"array"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"title"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"Keyboard shortcuts configuration"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"items"</span><span style="color: #BBBBBB">: {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"type"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"object"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"required"</span><span style="color: #BBBBBB">: [</span><span style="color: #CE9178">"key"</span><span style="color: #BBBBBB">],</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"defaultSnippets"</span><span style="color: #BBBBBB">: [</span></span> <span class="line"><span style="color: #BBBBBB"> {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"label"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"New keyboard shortcut"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"description"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"Binds a key to a command for a given state"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"body"</span><span style="color: #BBBBBB">: { </span><span style="color: #9CDCFE">"key"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"$1"</span><span style="color: #BBBBBB">, </span><span style="color: #9CDCFE">"command"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"$2"</span><span style="color: #BBBBBB">, </span><span style="color: #9CDCFE">"when"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"$3"</span><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB"> ],</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"properties"</span><span style="color: #BBBBBB">: {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"key"</span><span style="color: #BBBBBB">: {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"type"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"string"</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #F44747">...</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB">}</span></span> <span class="line"></span></code></pre> <p>This is an example in a JSON schema:</p> <p><img src="/assets/docs/languages/json/defaultSnippets.png" alt="Default snippets in JSON schema" loading="lazy"></p> <p>Use the property <code>defaultSnippets</code> to specify any number of snippets for the given JSON object.</p> <ul> <li><code>label</code> and <code>description</code> will be shown in the completion selection dialog. If no label is provided, a stringified object representation of the snippet will be shown as label instead.</li> <li><code>body</code> is the JSON object that is stringified and inserted when the completion is selected by the user. <a href="/docs/editor/userdefinedsnippets#_snippet-syntax">Snippet syntax</a> can be used inside strings literals to define tabstops, placeholders, and variables. If a string starts with <code>^</code>, the string content will be inserted as-is, not stringified. You can use this to specify snippets for numbers and booleans.</li> </ul> <p>Note that <code>defaultSnippets</code> is not part of the JSON schema specification but a VS Code-specific schema extension.</p> <h3 id="_use-rich-formatting-in-hovers" data-needslink="_use-rich-formatting-in-hovers">Use rich formatting in hovers</h3> <p>VS Code will use the standard <code>description</code> field from the <a href="https://json-schema.org/specification" class="external-link" target="_blank">JSON Schema specification</a> in order to provide information about properties on hover and during autocomplete.</p> <p>If you want your descriptions to support formatting like links, you can opt in by using <a href="/docs/languages/markdown">Markdown</a> in your formatting with the <code>markdownDescription</code> property.</p> <pre class="shiki" style="background-color: #1e1e1e"><code><span class="line"><span style="color: #BBBBBB">{</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"$schema"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"http://json-schema.org/draft-07/schema#"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"type"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"object"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"properties"</span><span style="color: #BBBBBB">: {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"name"</span><span style="color: #BBBBBB">: {</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"type"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"string"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"description"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"The name of the entry"</span><span style="color: #BBBBBB">,</span></span> <span class="line"><span style="color: #BBBBBB"> </span><span style="color: #9CDCFE">"markdownDescription"</span><span style="color: #BBBBBB">: </span><span style="color: #CE9178">"The name of the entry. [See the documentation](https://example.com)"</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB"> }</span></span> <span class="line"><span style="color: #BBBBBB">}</span></span> <span class="line"></span></code></pre> <p>Note that <code>markdownDescription</code> is not part of the JSON schema specification but a VS Code-specific schema extension.</p> <h3 id="_offline-mode" data-needslink="_offline-mode">Offline mode</h3> <p><span class="setting"><a href="vscode://settings/json.schemaDownload.enable" codesetting="true"><span class="codicon codicon-settings-gear dynamic-setting-icon" title="Open 'json.schemaDownload.enable' in Settings Editor"></span></a>json.schemaDownload.enable</span> controls whether the JSON extension fetches JSON schemas from <code>http</code> and <code>https</code>.</p> <p>A warning triangle will show in the status bar when the current editor would like to use schemas that cannot be downloaded.</p> <div class="feedback"></div> <div class="body-footer">02/06/2025</div> </main>  <div class="col-sm-3 col-md-2 hidden-xs docs-subnavbar-container"> <nav id="docs-subnavbar" aria-label="On Page" data-spy="affix" data-offset-top="20"> <h4><span class="sr-only">In this article there are 7 sections</span><span aria-hidden="true">In this article</span></h4> <ul class="nav"> <li><a href="#_intellisense-and-validation">IntelliSense and validation</a></li> <li><a href="#_quick-navigation">Quick navigation</a></li> <li><a href="#_hovers">Hovers</a></li> <li><a href="#_formatting">Formatting</a></li> <li><a href="#_folding">Folding</a></li> <li><a href="#_json-with-comments">JSON with Comments</a></li> <li><a href="#_json-schemas-and-settings">JSON schemas and settings</a></li> </ul> <div class="connect-widget"></div> </nav> </div>  <div class="col-xs-12 visible-xs"> <div class="connect-widget"></div> </div> </div> </div> </div> </div> <footer role="contentinfo" class="container"> <div class="footer-container"> <div class="footer-row"> <div class="footer-social"> <ul class="links"> <li> <a href="https://go.microsoft.com/fwlink/?LinkID=533687"><img src="/assets/icons/x-icon.svg" class="x-icon" alt="Follow us on X"></a> </li> <li> <a href="https://github.com/microsoft/vscode"><img src="/assets/icons/github-icon.svg" alt="VS Code on Github"></a> </li> <li> <a href="https://www.youtube.com/@code"><img src="/assets/icons/youtube-icon.svg" alt="VS Code on YouTube"></a> </li> <script> function manageConsent() { if (siteConsent && siteConsent.isConsentRequired) { siteConsent.manageConsent(); } } </script> </ul> <a id="footer-microsoft-link" class="microsoft-logo" href="https://www.microsoft.com"> <img src="/assets/icons/microsoft.svg" alt="Microsoft homepage" /> </a> </div> </div> <div class="footer-row"> <ul class="links"> <li><a id="footer-support-link" href="https://support.serviceshub.microsoft.com/supportforbusiness/create?sapId=d66407ed-3967-b000-4cfb-2c318cad363d" target="_blank" rel="noopener">Support</a></li> <li><a id="footer-privacy-link" href="https://go.microsoft.com/fwlink/?LinkId=521839" target="_blank" rel="noopener">Privacy</a></li> <li style="display: none;"><a id="footer-cookie-link" style="cursor: pointer;" onclick="manageConsent()" target="_blank" rel="noopener">Manage Cookies</a></li> <li><a id="footer-terms-link" href="https://www.microsoft.com/legal/terms-of-use" target="_blank" rel="noopener">Terms of Use</a></li> <li><a id="footer-license-link" href="/License" target="_blank" rel="noopener">License</a></li> </ul> </div> </div> </footer> <script type="module"> document.addEventListener('DOMContentLoaded', () => { const copilotDeepLinks = document.querySelectorAll('.copilot-deep-link'); if (copilotDeepLinks.length === 0) { return; } if (window.innerWidth < 992) { for (const link of copilotDeepLinks) { link.href = 'https://aka.ms/vscode-activatecopilotfree'; } } }); </script> <script src="/dist/index.js"></script> <script type="application/ld+json"> { "@context" : "http://schema.org", "@type" : "SoftwareApplication", "name" : "Visual Studio Code", "softwareVersion": "1.97", "offers": { "@type": "Offer", "price": "0", "priceCurrency": "USD" }, "applicationCategory": "DeveloperApplication", "applicationSubCategory": "Text Editor", "alternateName": "VS Code", "datePublished": "2021-11-03", "operatingSystem": "Mac, Linux, Windows", "logo": "https://code.visualstudio.com/assets/apple-touch-icon.png", "screenshot": "https://code.visualstudio.com/assets/home/home-screenshot-win.png", "releaseNotes": "https://code.visualstudio.com/updates", "downloadUrl": "https://code.visualstudio.com/download", "license": "https://code.visualstudio.com/license", "softwareRequirements": "https://code.visualstudio.com/docs/supporting/requirements", "url" : "https://code.visualstudio.com", "author": { "@type": "Organization", "name": "Microsoft" }, "publisher": { "@type": "Organization", "name": "Microsoft" }, "maintainer": { "@type": "Organization", "name": "Microsoft" }, "potentialAction": { "@type": "SearchAction", "target": "https://code.visualstudio.com/Search?q={search_term_string}", "query-input": "required name=search_term_string" }, "sameAs" : [ "https://en.wikipedia.org/wiki/Visual_Studio_Code", "https://twitter.com/code", "https://www.youtube.com/code", "https://www.tiktok.com/@vscode", "https://github.com/microsoft/vscode" ] } </script> </body> </html>

CINXE.COM

Editing JSON with Visual Studio Code