使用Visual Studio Code编辑JSON。

JSON 是一种常见于配置文件(如package.jsonproject.json.我们在Visual Studio Code中也大量使用它来处理配置文件。当打开一个以.jsonVS Code 提供了简化文件内容编写或修改的功能。

VS Code 中的 JSON

IntelliSense 与验证

对于属性和值,无论是带模式还是无模式的JSON数据,我们都会在你用IntelliSense输入时提供建议。你也可以手动查看 Trigger Suggestions 命令(⌃Space(Windows,Linux Ctrl+Space)。

我们还基于关联的JSON模式进行结构性和数值验证,给你红色曲线。要禁用验证,请使用

json.validate.enable
  • 在VS代码中打开
  • 在VS Code Insiders中开放
环境

IntelliSense

包和项目依赖

我们还提供针对特定价值集的IntelliSense,如包和项目依赖,在package.json,project.json, 和bower.json.

快速导航

JSON 文件可以非常大,我们支持使用“去到符号”命令(⇧⌘O(Windows,Linux Ctrl+Shift+O)快速导航到属性。

后藤标志

悬浮

当你将鼠标悬停在带有或不带模式的JSON数据属性和值上时,我们会提供更多上下文。

悬停

格式

你可以在右键菜单中使用⇧⌥F(Windows Shift+Alt+F,Linux Ctrl+Shift+I格式化文档来格式化JSON文档。

折叠

你可以用字槽上的折叠图标,在行号和行起始之间折叠源代码的部分区域。所有对象和数组元素均可使用折叠区域。

带注释的 JSON

除了遵循 JSON 规范的默认 JSON 模式外,VS Code 还有带注释的 JSON 模式(jsonc)。该模式用于 VS Code 配置文件,如settings.json,tasks.json,或者launch.json.在带注释的 JSON 模式下,你可以使用单行注释(),也可以像 JavaScript 中使用的那样屏蔽注释()。该模式也接受后尾逗号,但不鼓励使用,编辑器会显示警告。///* */

当前编辑器模式在编辑器的状态栏中显示。选择模式指示器以更改模式并配置文件扩展名与模式的关联。你也可以直接修改

文件.associations
  • 在VS代码中打开
  • 在VS Code Insiders中开放
设置为关联文件名或文件名模式JSONC.

JSON 模式与设置

为了理解 JSON 文件的结构,我们使用 JSON 模式。JSON 模式描述了 JSON 文件的形状,以及值集、默认值和描述。VS Code 随附的 JSON 支持支持从第 4 稿到第 7 稿的所有版本,但对 2019-09 和 2020-12 版的支持有限。

JSON Schema Store 这样的服务器为大多数常见的基于 JSON 的配置文件提供了模式。不过,模式也可以在 VS Code 工作区的文件中定义,也可以在 VS Code 设置文件中定义。

将 JSON 文件与模式关联可以直接在 JSON 文件中完成,使用$schema属性,或者在用户或工作区设置文件>偏好设置>设置)中的属性中

json.schemas
  • 在VS代码中打开
  • 在VS Code Insiders中开放
.

VS Code 扩展还可以定义模式和模式映射。这就是为什么 VS Code 已经知道一些知名 JSON 文件的模式,比如package.json,bower.json, 和tsconfig.json.

JSON 中的映射

在以下示例中,JSON 文件指定其内容遵循 CoffeeLint 模式。

{
  "$schema": "https://json.schemastore.org/coffeelint",
  "line_endings": "unix"
}

请注意,该语法是VS Code特有的,不属于JSON模式规范。添加$schema密钥会改变JSON本身,而使用JSON的系统可能不会预料到这一点,例如模式验证可能失败。如果是这样,你可以用其他映射方法。

用户设置中的映射

以下是用户设置中的摘录,展示了具体方法.babelrc文件映射到位于 https://json.schemastore.org/babelrc 上的Babelrc模式。

"json.schemas": [
    {
        "fileMatch": [
            "/.babelrc"
        ],
        "url": "https://json.schemastore.org/babelrc"
    }
]

提示:除了定义一个模式外.babelrc,还要确保.babelrc与JSON语言模式相关联。这也可以在设置里用文件.association阵列设置。

映射到工作区中的模式

要映射位于工作区中的模式,可以使用相对路径。在这个例子中,工作区根中一个文件称为myschema.json将作为所有以.foo.json.

"json.schemas": [
    {
        "fileMatch": [
            "**/*.foo.json"
        ],
        "url": "./myschema.json"
    }
]

映射到设置中定义的模式

要映射用户或工作区设置中定义的模式,请使用结构财产。在这个例子中,定义了一个模式,用于所有被命名的文件.myconfig.

"json.schemas": [
    {
        "fileMatch": [
            "/.myconfig"
        ],
        "schema": {
            "type": "object",
            "properties": {
                "name" : {
                    "type": "string",
                    "description": "The name of the entry"
                }
            }
        }
    }
]

扩展中的模式映射

模式和模式关联也可以通过扩展定义。看看jsonValidation贡献点

文件匹配语法

文件匹配语法支持“*”万用符。此外,你可以定义排除模式,以“!”开头。要使关联匹配,至少需要一个模式匹配,且最后一个匹配模式不能是排除模式。

  "json.schemas": [
    {
      "fileMatch": [
        "/receipts/*.json",
        "!/receipts/*.excluded.json"
      ],
      "url": "./receipts.schema.json"
    }
  ]

在 JSON 模式中定义片段

JSON 模式描述了 JSON 文件的形状,以及值集和默认值,这些值被 JSON 语言支持用来提供完成提案。如果你是模式作者,想要提供更多定制化的完成提案,也可以在模式中指定摘要。

以下示例展示了定义一个片段的键盘快捷键设置文件的模式:

{
    "type": "array",
    "title": "Keyboard shortcuts configuration",
    "items": {
        "type": "object",
        "required": ["key"],
        "defaultSnippets": [
            {
                "label": "New keyboard shortcut",
                "description": "Binds a key to a command for a given state",
                "body": { "key": "$1", "command": "$2", "when": "$3" }
            }
        ],
        "properties": {
            "key": {
                "type": "string"
            }
            ...
        }
    }
}

这是一个 JSON 模式中的示例:

JSON 模式中的默认片段

利用该物业默认摘要为给定的 JSON 对象指定任意数量的 snippet。

  • 唱片公司以及描述将在完成选择对话框中显示。如果没有提供标签,则会以标签的形式显示该片段的字符串化对象表示。
  • 身体是用户选择完备时被字符串化并插入的JSON对象。片段语法可以在字符串文字中用于定义制表符、占位符和变量。如果字符串以 开头,字符串内容将直接插入,而非字符串化。你可以用它来指定数字和布尔值的片段。^

注意默认摘要不属于JSON模式规范,而是VS Code专用的模式扩展。

悬停时使用丰富格式

VS Code 将采用该标准描述JSON Schema 规范中的字段,以便在悬停和自动补全时提供属性信息。

如果你希望描述支持像链接那样的格式化,可以通过使用Markdown来选择加入markdown描述财产。

{
  "$schema": "http://json-schema.org/draft-07/schema#",
  "type": "object",
  "properties": {
    "name": {
      "type": "string",
      "description": "The name of the entry",
      "markdownDescription": "The name of the entry. [See the documentation](https://example.com)"
    }
  }
}

注意markdown描述不属于JSON模式规范,而是VS Code专用的模式扩展。

离线模式

json.schemaDownload.enable
  • 在VS代码中打开
  • 在VS Code Insiders中开放
控制 JSON 扩展是否从http以及https.

当当前编辑器想使用无法下载的模式时,状态栏会显示警告三角形。