{"id":694,"date":"2014-02-27T23:51:30","date_gmt":"2014-02-27T23:51:30","guid":{"rendered":"https:\/\/blogs.msdn.microsoft.com\/webdev\/2014\/02\/27\/new-json-editor-features-in-visual-studio-2013-update-2-ctp2\/"},"modified":"2022-08-09T02:34:47","modified_gmt":"2022-08-09T09:34:47","slug":"new-json-editor-features-in-visual-studio-2013-update-2-ctp2","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/dotnet\/new-json-editor-features-in-visual-studio-2013-update-2-ctp2\/","title":{"rendered":"New JSON editor features in Visual Studio 2013 Update 2 CTP2"},"content":{"rendered":"<p>The Customer Tech Preview (CTP2) release of Visual Studio 2013 Update 2 contains a new JSON editor. In this release, the JSON editor includes a number of features such as colorization, and JSON syntax validation. More features will be added during subsequent releases.<\/p>\n<p><strong>New JSON item template<\/strong><\/p>\n<p>In a web application, you can use the new JSON item template under the <b>Markup<\/b> category to add a new file with the .<i>json<\/i> extension.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/2084.clip_image001_16705B46.png\"><img decoding=\"async\" title=\"clip_image001\" border=\"0\" alt=\"clip_image001\" src=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/2084.clip_image001_16705B46.png\" width=\"644\" height=\"365\" \/><\/a><\/p>\n<p><strong><\/strong><\/p>\n<p><strong>Colorization<\/strong><\/p>\n<p>When opening a file in the JSON editor, the content will be tokenized and have distinct colors. Invalid tokens will have the default black color as shown below.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/3173.clip_image002_4148BF58.png\"><img decoding=\"async\" title=\"clip_image002\" border=\"0\" alt=\"clip_image002\" src=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/3173.clip_image002_4148BF58.png\" width=\"244\" height=\"174\" \/><\/a><\/p>\n<p>The color for numbers can be set using the setting at <b>Tools<\/b> \u2013&gt; <b>Options<\/b> \u2013&gt; <b>Environment<\/b> \u2013&gt; <b>Fonts and Colors<\/b> \u2013&gt; <b>Number<\/b>.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/2500.clip_image003_16042851.png\"><img decoding=\"async\" title=\"clip_image003\" border=\"0\" alt=\"clip_image003\" src=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/2500.clip_image003_16042851.png\" width=\"644\" height=\"377\" \/><\/a><\/p>\n<p><strong><\/strong><\/p>\n<p><strong>JSON syntax validation<\/strong><\/p>\n<p>Visual Studio 12 Update 2 will validate JSON syntax and provide squiggle syntax errors that have been detected, and list them in the <b>Error List<\/b> window. Double-clicking on an error in the <b>Error List<\/b> will bring the file to the foreground if it\u2019s not currently active and put the cursor at the error.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/4571.clip_image004_07597C6C.png\"><img decoding=\"async\" title=\"clip_image004\" border=\"0\" alt=\"clip_image004\" src=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/4571.clip_image004_07597C6C.png\" width=\"644\" height=\"305\" \/><\/a><\/p>\n<p><strong><\/strong><\/p>\n<p><strong>Automatic brace completion and type-through<\/strong><\/p>\n<p>When you type an opening bracket or quote, the matching closing character is automatically inserted after the cursor. If you type the automatically inserted character, you will \u201ctype through\u201d that character. This would help keep your fingers in home position and maintain the typing flow.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/5141.clip_image005_003A3FF4.png\"><img decoding=\"async\" title=\"clip_image005\" border=\"0\" alt=\"clip_image005\" src=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/5141.clip_image005_003A3FF4.png\" width=\"117\" height=\"46\" \/><\/a><\/p>\n<p><strong><\/strong><\/p>\n<p><strong>Outlining<\/strong><\/p>\n<p>Outlining is available for the JSON content so you can choose to either collapse or expand any part of the content for easy viewing.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/7230.clip_image006_791B037B.png\"><img decoding=\"async\" title=\"clip_image006\" border=\"0\" alt=\"clip_image006\" src=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/7230.clip_image006_791B037B.png\" width=\"529\" height=\"484\" \/><\/a><\/p>\n<p><strong><\/strong><\/p>\n<p><strong>Tools Options Settings<\/strong><\/p>\n<p>In addition to the general <b>Text Editor<\/b> settings, we offer the <b>Validation<\/b> settings under the <b>Advanced<\/b> tab that you can change to suite your desire.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/8228.clip_image007_38E4EA01.png\"><img decoding=\"async\" title=\"clip_image007\" border=\"0\" alt=\"clip_image007\" src=\"https:\/\/devblogs.microsoft.com\/aspnet\/wp-content\/uploads\/sites\/16\/2014\/02\/8228.clip_image007_38E4EA01.png\" width=\"644\" height=\"195\" \/><\/a><\/p>\n<p><strong><\/strong><\/p>\n<p><strong>JSON content sniffing<\/strong><\/p>\n<p>When double-clicking a file in <b>Solution<\/b> <b>Explorer<\/b> to open a file with an unknown extension, the JSON editor will scan through the content of the file and determine if it\u2019s indeed a JSON file. If so, the JSON editor will open the file and you will see all of the features mentioned above.<\/p>\n<p>However, if the JSON editor detects that there are more than 5 errors in the first 4 kilobytes of the content, it will quit and the file will be treated the same way as an unknown file extension, where it will be opened in whatever editor set as the default.<\/p>\n<p>There will be additional features in the JSON editor in subsequent releases and we will blog more about them when they become available.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The Customer Tech Preview (CTP2) release of Visual Studio 2013 Update 2 contains a new JSON editor. In this release, the JSON editor includes a number of features such as colorization, and JSON syntax validation. More features will be added during subsequent releases. New JSON item template In a web application, you can use the [&hellip;]<\/p>\n","protected":false},"author":423,"featured_media":58792,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[197],"tags":[],"class_list":["post-694","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-aspnet"],"acf":[],"blog_post_summary":"<p>The Customer Tech Preview (CTP2) release of Visual Studio 2013 Update 2 contains a new JSON editor. In this release, the JSON editor includes a number of features such as colorization, and JSON syntax validation. More features will be added during subsequent releases. New JSON item template In a web application, you can use the [&hellip;]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/posts\/694","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/users\/423"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/comments?post=694"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/posts\/694\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/media\/58792"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/media?parent=694"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/categories?post=694"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/tags?post=694"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}