WebStorm 2021.1 Help

JSON

JSON格式通常用于存储数据和配置文件。WebStorm 帮助您处理 JSON 文件——它检查它们的语法和格式。在流行的配置文件类型中,WebStorm 提供了代码补全,这要归功于JSON Schema,这是一种用于描述此类文件的结构和内容的特殊格式。您还可以使用自定义 JSON 模式在 JSON 文件中启用代码完成并对其进行验证。

启用 JSON5

WebStorm 识别许多最流行的 JSON 标准,包括JSON5。WebStorm 默认将带有json5扩展名的文件视为 JSON5 文件,并在其中支持这种新语法。

使用 JSON5 的配置文件,默认扩展名为 .json5

将 JSON5 语法扩展到所有 JSON 文件

  1. Settings/Preferences对话框 ( Ctrl+Alt+S) 中,转到Editor | 文件类型

  2. 在已识别的文件类型列表中,选择JSON5

  3. 在“文件名模式”区域中,单击添加*.json在打开的“添加通配符”对话框中键入。

使用 JSON Schema Store 中的模式

WebStorm 可以自动从JSON Schema Store下载和使用模式,该存储为许多流行的配置文件托管模式文件。一旦您打开一个名称与可用架构之一相关联的文件(例如,tslint.json),WebStorm 就会下载并使用此架构。应用模式的名称显示在状态栏上。

从 JSON Schema Store 下载的 JSON 模式,应用模式的名称显示在状态栏中

如果您的配置文件具有自定义名称或您正在使用临时文件,请单击状态栏上的无 JSON 模式并从列表中选择所需的模式,或单击新模式映射以打开JSON 模式映射页面配置新的自定义架构

当前文件没有 JSON 模式

默认情况下,从 JSON Schema Store 自动下载 Schema 是启用的。如果它被关闭,您可以随时重新启用它。

从 JSON Schema Store 启用自动下载模式

  1. Settings/Preferences对话框 ( Ctrl+Alt+S) 中,转到Languages and Frameworks | 模式和 DTD | 远程 JSON 模式

  2. 选中允许从远程源下载 JSON 模式使用 schemastore.org JSON 模式目录复选框。

WebStorm 捆绑了许多流行的模式。尽管这些模式会定期自动更新,但它们仍然可能碰巧过时。

使用最新版本的捆绑模式

  1. Settings/Preferences对话框 ( Ctrl+Alt+S) 中,转到Languages and Frameworks | 模式和 DTD | 远程 JSON 模式

  2. 选中始终下载最新版本的架构复选框。

使用自定义 JSON 模式

除了来自 JSON Schema Store 的模式外,WebStorm 还允许您配置和使用来自其他存储的自定义模式。您可以下载所需的架构并将其存储在项目根目录下或指定资源的 URL,以便 WebStorm 可以自动下载架构。

配置自定义 JSON 架构

  1. Settings/Preferences对话框 ( Ctrl+Alt+S) 中,转到Languages and Frameworks | 模式和 DTD | JSON 模式映射

  2. 在显示您之前配置的所有自定义模式的中央窗格中,单击添加工具栏上的 。

  3. 指定 Schema 的名称和Schema 符合的Schema Specification 版本。架构文件或 URL字段中,指定先前下载的架构文件的位置或键入所需架构可用的 URL。

  4. 创建要针对此架构进行验证的文件或文件夹的列表。该列表可能包含特定文件的名称、整个目录的名称和文件名模式。基于该列表,WebStorm 在内部检测要验证的文件。

    要将项目添加到列表中,请单击添加映射并指定文件或文件夹的路径或键入文件模式。

启用从远程源自动下载 JSON 模式

  1. Settings/Preferences对话框 ( Ctrl+Alt+S) 中,转到Languages and Frameworks | 模式和 DTD | 远程 JSON 模式

  2. 选择允许从远程源下载 JSON 模式

    清除该复选框后,将禁用 JSON 模式周围的任何网络活动,包括来自 JSON 模式存储的模式。

处理模式范围之间的冲突

当文件、文件夹或模式属于两个或多个模式的范围时,就会出现冲突。WebStorm 以两种模式分析范围:

  • 静态分析检测自定义模式范围内的冲突。如果检测到冲突,WebStorm 会在“架构详细信息”窗格中显示警告。要查看重叠范围,请单击显示详细信息链接。WebStorm 显示一个弹出消息,其中列出了冲突的范围和模式:

    设置/首选项对话框中有关冲突架构范围的通知

  • 动态分析检测系统和自定义模式范围内的冲突。当您打开属于某个范围的文件时,就会开始这种类型的分析。如果检测到冲突,WebStorm 会在编辑器选项卡的顶部显示警告:

    关于编辑器中冲突模式范围的通知
    单击该链接以打开JSON 架构映射页面并编辑冲突的自定义架构的范围。请注意,您不能编辑系统模式的范围。

在 JSON 模式中使用 HTML 描述

默认情况下,WebStorm 在文档弹出窗口中显示 JSON 模式定义的文档时会转义 HTML 字符。要获得具有丰富 HTML 标记的漂亮文档,请将 HTML 描述存储在x-intellij-html-description扩展属性中,而不是description.

{ “id”:“http://some.site.somewhere/entry-schema#”,“$schema”:“http://json-schema-org/draft-06/schema#”,“类型”: “object”,“required”:[“options”],“properties”:{“options”:{“type”:“array”,“description”:“有趣的细节:Fresh New Awesome”,“minItems”:1 , "items": { "type": "string" }, "uniqueItems": true, }, "readonly": { "type": "boolean" } } }
具有描述属性的 JSON 模式定义的文档中没有格式
{ “id”:“http://some.site.somewhere/entry-schema#”,“$schema”:“http://json-schema-org/draft-06/schema#”,“类型”: "object", "required": [ "options" ], "properties": { "options": { "type": "array", "x-intellij-html-description": "<p><b>有趣</b> <i>详情:</i></p>\n <ul><li>新鲜</li><li>新品</li><li>真棒</li></ul> \n <div style='background-color: #fff77c'>选择带有 HTML 描述的架构 =)</div>", "minItems": 1, "items": { "type": "string" }, "uniqueItems": true, }, "readonly": { "type": "boolean" } } }
具有 x-intellij-html-description 属性的 JSON 模式定义文档中的 HTML 描述

配置语法高亮

您可以根据自己的喜好和习惯配置 JSON 感知语法突出显示。

  1. Settings/Preferences对话框 ( Ctrl+Alt+S) 中,转到Editor | 配色方案 | JSON

  2. 选择配色方案,接受从默认值继承的突出显示设置,或按照颜色和字体中的说明自定义它们。

最后修改:2021 年 12 月 22 日