如何在Visual Studio 2022中为Blazor（*.razor）文件创建自定义代码片段

方法一：手动编写正确的代码片段文件 #

Visual Studio中Blazor Razor文件对应的语言标识符是aspnetcorerazor，直接在.snippet文件的<Code>标签中指定这个语言值即可，无需使用CSharp或HTML。

示例自定义Blazor组件代码片段文件：

<?xml version="1.0" encoding="utf-8"?>
<CodeSnippets xmlns="http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet">
  <CodeSnippet Format="1.0.0">
    <Header>
      <Title>自定义Blazor组件模板</Title>
      <Shortcut>blazcomp</Shortcut>
      <Description>快速生成带子内容参数的Blazor组件</Description>
      <Author>自定义作者</Author>
      <SnippetTypes>
        <SnippetType>Expansion</SnippetType>
      </SnippetTypes>
    </Header>
    <Snippet>
      <Declarations>
        <Literal>
          <ID>ComponentName</ID>
          <ToolTip>组件类名</ToolTip>
          <Default>MyBlazorComponent</Default>
        </Literal>
      </Declarations>
      <Code Language="aspnetcorerazor"><![CDATA[
<div class="$ComponentName-container">
    <h2>@ComponentName</h2>
    @ChildContent
</div>

@code {
    [Parameter]
    public RenderFragment? ChildContent { get; set; }
}
]]></Code>
    </Snippet>
  </CodeSnippet>
</CodeSnippets>

导入步骤：

• 打开Visual Studio 2022，点击顶部菜单的工具 -> 代码片段管理器
• 在“语言”下拉菜单中选择ASP.NET Core Razor
• 点击导入，选择你编写的.snippet文件，完成导入后即可在Razor文件中使用：输入快捷键（比如示例中的blazcomp），按Tab键就能插入代码片段。

方法二：使用Visual Studio扩展 #

可以在Visual Studio Marketplace中搜索针对Blazor的代码片段扩展，这类工具通常支持可视化创建、管理Razor文件的自定义代码片段，无需手动编写XML文件，能直接解决语言匹配问题，让片段插入更顺畅。

方法三：排查原有片段的问题 #

之前用CSharp或HTML语言的片段能显示但无法插入，是因为Razor文件是C#与HTML的混合语法环境，跨语言的片段会触发编辑器的语法校验冲突。必须确保片段的语言属性与Razor文件的语言标识符匹配，才能正常完成插入。

内容的提问来源于stack exchange，提问作者bill_dom