{"id":92723,"date":"2019-04-18T22:02:12","date_gmt":"2019-04-18T22:02:12","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/aspnet\/?p=21822"},"modified":"2019-04-18T22:02:12","modified_gmt":"2019-04-18T22:02:12","slug":"updated-razor-support-in-visual-studio-code-now-with-blazor-support","status":"publish","type":"post","link":"https:\/\/sickgaming.net\/blog\/2019\/04\/18\/updated-razor-support-in-visual-studio-code-now-with-blazor-support\/","title":{"rendered":"Updated Razor support in Visual Studio Code, now with Blazor support"},"content":{"rendered":"<div class=\"row justify-content-center\">\n<div class=\"col-md-4\">\n<div><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.sickgaming.net\/blog\/wp-content\/uploads\/2019\/04\/updated-razor-support-in-visual-studio-code-now-with-blazor-support.jpg\" width=\"58\" height=\"58\" alt=\"Daniel Roth\" class=\"avatar avatar-58 wp-user-avatar wp-user-avatar-58 alignnone photo\"><\/p>\n<p>Daniel<\/p>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"entry-meta\">\n<p>April 18th, 2019<\/p>\n<\/p><\/div>\n<p><!-- .entry-meta --> <\/p>\n<p>Today we are pleased to announce improved Razor tooling support in Visual Studio Code with the latest C# extension. This latest release includes improved Razor diagnostics and support for tag helpers and Blazor apps.<\/p>\n<h2>Get Started<\/h2>\n<p>To use this preview of Razor support in Visual Studio Code install the following:<\/p>\n<p>To try out Visual Studio Code with <a href=\"https:\/\/blazor.net\">Blazor<\/a> apps, also install:<\/p>\n<ul>\n<li><a href=\"https:\/\/aka.ms\/netcore3download\">.NET Core 3.0<\/a> (Preview 4 or later)<\/li>\n<li>\n<p>The latest Blazor CLI templates:<\/p>\n<pre><code>dotnet new -i Microsoft.AspNetCore.Blazor.Templates::3.0.0-preview4-19216-03\n<\/code><\/pre>\n<\/li>\n<\/ul>\n<h2>What\u2019s new in this release?<\/h2>\n<h3>Improved diagnostics<\/h3>\n<p>We\u2019ve improved the Razor diagnostics in Visual Studio Code for a variety of scenarios, including floating <code>@<\/code> characters:<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.sickgaming.net\/blog\/wp-content\/uploads\/2019\/04\/updated-razor-support-in-visual-studio-code-now-with-blazor-support.png\" alt=\"Floating @ character\"><\/p>\n<p>Missing end braces:<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.sickgaming.net\/blog\/wp-content\/uploads\/2019\/04\/updated-razor-support-in-visual-studio-code-now-with-blazor-support-1.png\" alt=\"Missing end brace\"><\/p>\n<p>And missing end tags in code blocks:<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.sickgaming.net\/blog\/wp-content\/uploads\/2019\/04\/updated-razor-support-in-visual-studio-code-now-with-blazor-support-2.png\" alt=\"Missing end tag\"><\/p>\n<h3>Tag helpers<\/h3>\n<p>Tag helper completions are now supported in ASP.NET Core projects:<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.sickgaming.net\/blog\/wp-content\/uploads\/2019\/04\/updated-razor-support-in-visual-studio-code-now-with-blazor-support.gif\" alt=\"Tag helper completion\"><\/p>\n<p>As well as completions for tag helper attribute names and values:<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.sickgaming.net\/blog\/wp-content\/uploads\/2019\/04\/updated-razor-support-in-visual-studio-code-now-with-blazor-support-1.gif\" alt=\"Tag helper attribute completion\"><\/p>\n<h3>Blazor<\/h3>\n<p>Visual Studio Code now works with <a href=\"https:\/\/blazor.net\">Blazor<\/a> apps too!<\/p>\n<p>You get completions for components and component parameters:<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.sickgaming.net\/blog\/wp-content\/uploads\/2019\/04\/updated-razor-support-in-visual-studio-code-now-with-blazor-support-2.gif\" alt=\"Component completions\"><\/p>\n<p>Also data-binding, event handlers and lots of other Blazor goodies!<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.sickgaming.net\/blog\/wp-content\/uploads\/2019\/04\/updated-razor-support-in-visual-studio-code-now-with-blazor-support-3.gif\" alt=\"Blazor todos\"><\/p>\n<h2>Limitations and known issues<\/h2>\n<p>This is an alpha release of the Razor tooling for Visual Studio Code, so there are a number of limitations and known issues:<\/p>\n<ul>\n<li>Razor editing is currently only supported in ASP.NET Core and Blazor projects (no support for ASP.NET projects)<\/li>\n<li>Limited support for colorization<\/li>\n<\/ul>\n<p>Note that if you need to disable the Razor tooling:<\/p>\n<ul>\n<li>Open the Visual Studio Code User Settings: <em>File<\/em> -&gt; <em>Preferences<\/em> -&gt; <em>Settings<\/em><\/li>\n<li>Search for \u201crazor\u201d<\/li>\n<li>Check the \u201cRazor: Disabled\u201d checkbox<\/li>\n<\/ul>\n<h2>Feedback<\/h2>\n<p>Please let us know what you think about this latest update to the Razor tooling support in Visual Studio Code by reporting issues in the <a href=\"https:\/\/github.com\/aspnet\/Razor.VSCode\">Razor.VSCode<\/a> repo. When reporting Razor tooling related issues please use the \u201cReport a Razor Issue\u201d command in Visual Studio Code to capture all of the relevant longs and diagnostic information. Just run the command and then follow the instructions.<\/p>\n<p>Thanks for trying out Razor in Visual Studio Code!<\/p>\n<div class=\"authorinfoarea\">\n<div><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.sickgaming.net\/blog\/wp-content\/uploads\/2019\/04\/updated-razor-support-in-visual-studio-code-now-with-blazor-support.jpg\" width=\"96\" height=\"96\" alt=\"Daniel Roth\" class=\"avatar avatar-96 wp-user-avatar wp-user-avatar-96 alignnone photo\"><\/div>\n<div>\n<h5><a class=\"no-underline\" aria-label=\"Daniel Roth\" target=\"_blank\" href=\"https:\/\/devblogs.microsoft.com\/aspnet\/author\/danroth27\/\" rel=\"noopener noreferrer\">Daniel Roth<\/a><\/h5>\n<p>Principal Program Manager,&nbsp;ASP.NET<\/p>\n<p><strong>Follow Daniel<\/strong>&nbsp;&nbsp;&nbsp;<a class=\"no-underline stayinformed\" aria-label=\"Daniel Roth Twitter profile\" target=\"_blank\" href=\"https:\/\/twitter.com\/danroth27\" rel=\"noopener noreferrer\"><i class=\"fa fa-twitter\"><\/i><\/a><a class=\"no-underline stayinformed\" aria-label=\"Daniel Roth GitHub profile\" target=\"_blank\" href=\"https:\/\/github.com\/danroth27\" rel=\"noopener noreferrer\"><i class=\"fa fa-github\"><\/i><\/a><a class=\"no-underline stayinformed hvr-pop\" aria-label=\"Daniel Roth RSS Feed\" target=\"_blank\" href=\"https:\/\/devblogs.microsoft.com\/aspnet\/author\/danroth27\/feed\/\" rel=\"noopener noreferrer\"><\/a><\/p>\n<\/p><\/div>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Daniel April 18th, 2019 Today we are pleased to announce improved Razor tooling support in Visual Studio Code with the latest C# extension. This latest release includes improved Razor diagnostics and support for tag helpers and Blazor apps. Get Started To use this preview of Razor support in Visual Studio Code install the following: To [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":92724,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[66],"tags":[498,67,120],"class_list":["post-92723","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-microsoft-webdev","tag-net-core","tag-aspnetcore","tag-blazor"],"_links":{"self":[{"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/posts\/92723","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/comments?post=92723"}],"version-history":[{"count":0,"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/posts\/92723\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/media\/92724"}],"wp:attachment":[{"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/media?parent=92723"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/categories?post=92723"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/tags?post=92723"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}