VSCode中Markdown代码块语法高亮相关文件位置及自定义问询

核心逻辑 #

VS Code的Markdown围栏代码块语法高亮，是通过TextMate语法定义文件关联语言标识符实现的，完全不需要修改内置的markdown-basics扩展文件（修改内置文件会被VS Code更新覆盖，不推荐这么做）。

具体操作步骤 #

• 步骤1：编写自定义语法定义文件
  新建一个.tmLanguage.json格式的文件（这是TextMate标准语法定义格式），比如要定义名为myLang的语言，文件内容示例：

  {
    "name": "My Language",
    "scopeName": "source.myLang",
    "fileTypes": ["mylang"],
    "patterns": [
      {
        "name": "comment.line.myLang",
        "match": "^#.*$"
      },
      {
        "name": "string.quoted.double.myLang",
        "match": "\"[^\"]*\""
      }
      // 可根据需求添加更多语法匹配规则
    ]
  }
  

  其中scopeName是核心标识，后续要通过它关联Markdown围栏代码块。

• 步骤2：关联Markdown围栏标识符
  打开VS Code用户设置（快捷键Ctrl+,），添加如下配置：

  "markdown.extension.codeBlockLanguageMap": {
    "mylang": "source.myLang"
  }
  

  这里的mylang是你在Markdown围栏里使用的标识符（比如```mylang），source.myLang对应语法文件里的scopeName。

• 步骤3：加载自定义语法文件
  把语法文件放到VS Code用户扩展目录：C:\Users\<你的用户名>\.vscode\extensions\下，新建一个独立文件夹（比如mylang-syntax），同时在该文件夹内创建package.json文件，内容示例：

  {
    "name": "mylang-syntax",
    "displayName": "My Language Syntax",
    "version": "0.0.1",
    "engines": {
      "vscode": "^1.0.0"
    },
    "contributes": {
      "languages": [
        {
          "id": "mylang",
          "aliases": ["My Language", "mylang"],
          "extensions": [".mylang"]
        }
      ],
      "grammars": [
        {
          "language": "mylang",
          "scopeName": "source.myLang",
          "path": "./mylang.tmLanguage.json"
        }
      ]
    }
  }
  

  若需要定义缩进、括号匹配等规则，可额外创建language-configuration.json文件并在package.json中关联，不需要的话可忽略此步骤。

• 步骤4：验证效果
  重启VS Code，在Markdown文档中编写：

  # 这是自定义语言的注释
  print("Hello MyLang")
  

  即可看到自定义的语法高亮效果。

注意事项 #

• 禁止修改VS Code内置的markdown-basics扩展文件，每次软件更新都会覆盖这些修改。
• 语法规则编写需遵循TextMate语法规范，patterns中的匹配规则和对应name决定了高亮样式（name对应主题中的语法颜色定义）。

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