Earlier this week we released a preview of support for working with Razor files (.cshtml) in the C# extension for Visual Studio Code (1.17.1). This initial release introduces C# completions, directive completions, and basic diagnostics (red squiggles for errors) for ASP.NET Core projects.
To use this preview of Razor support in Visual Studio Code install the following:
If you already installed VS Code and the C# extension in the past, make sure you have updated to the latest versions of both.
To try out the new Razor tooling, create a new ASP.NET Core web app and then edit any Razor (.cshtml) file.
- Open Visual Studio Code
- Select Terminal > New Terminal
In the new terminal run:
dotnet new webapp -o WebApp1` code -r WebApp1
Try out HTML completions
And Razor directive completions
And C# completions
You also get diagnostics (red squiggles)
Limitations and known issues
This is the first alpha release of the Razor tooling for Visual Studio Code, so there are a number of limitations and known issues:
- Razor editing is currently only supported in ASP.NET Core projects (no support for ASP.NET projects or Blazor projects yet)
- Support for tag helpers and formatting is not yet implemented
- Limited support for colorization
- Loss of HTML completions following C# less than (
- Error squiggles misaligned for expressions near the start of a new line
- Incorrect errors in Blazor projects for event bindings
- Emmet based abbreviation expansion is not yet supported
Note that if you need to disable the Razor tooling for any reason:
- Open the Visual Studio Code User Settings: File -> Preferences -> Settings
- Search for "razor"
- Check the "Razor: Disabled" checkbox
Even though the functionality of Razor tooling is currently pretty limited, we are shipping this preview now so that we can start collecting feedback. Any issues or suggestions for the Razor tooling in Visual Studio Code should be reported on the https://github.com/aspnet/Razor.VSCode repo.
To help us diagnose any reported issues please provide the following information in the GitHub issue:
- Razor (cshtml) file content
- Generated C# code from the Razor CSharp output
- Right-click inside your .cshtml file and select "Command Palette"
- Search for and select "Razor: Show Razor CSharp"
- Verbose Razor log output
- See instructions for capturing the Razor log output here
- OmniSharp log output
- Open VS Code's "Output" pane
- In the dropdown choose "OmniSharp Log"
Next up we are working on tag helper support. This will include support for tag helper completions and IntelliSense. Once we have tag helper tooling support in place we can then start work on enabling Blazor tooling support as well. Follow our progress and join in the conversation on the https://github.com/aspnet/Razor.VSCode repo.
Thanks for trying out this early preview!