PSI 查看器

从 编辑自定义属性 菜单中选择 帮助 ，或在欢迎屏幕上点击 配置 ，然后选择 编辑自定义属性。

WebStorm 会在配置目录中创建一个空的 idea.properties 文件，并在新的编辑器选项卡中打开它。 从 配置平台属性 中了解更多信息。

在 idea.properties 文件中，输入 idea.is.internal=true。

重启 WebStorm。

从 工具 菜单中选择 查看 PSI 结构。

请在 PSI 查看器 对话框中，在 文本 区域输入或粘贴要分析的源代码片段，选择文件类型，并指定其他选项。

• 从 显示 PSI 结构 列表中选择要查看的文件类型或语言构造。 可识别的文件类型取决于受支持的语言和已安装的插件。

• 选中 显示 PsiWhiteSpace 复选框，以显示与源代码中的空格相对应的 PsiWhiteSpace 节点。

• 在 文本 窗格中，输入需要查看的源代码。 请手动输入文本或从剪贴板粘贴文本。 如果您从编辑器中复制了一些文本，然后打开 PSI 查看器， 文本 窗格的先前内容将被选中，这使您可以使用 Ctrl+V 或 Ctrl+Shift+V 从剪贴板覆盖它。

  当您输入代码时，可以按 Ctrl+Y 删除文本光标所在行，使用 Ctrl+D 复制文本，并使用 Shift+Enter 添加行。

点击 生成 PSI 树 以生成 PSI 结构树视图，并在 PSI 结构 窗格中预览生成的 PSI 树。

如果修改了 文本 窗格中的源代码，请点击 生成 PSI 树 刷新树视图。

在树视图中导航时， 文本 窗格中相应的源代码片段会被高亮显示。 如果当前选定的树节点具有引用，则这些引用也会显示在 引用 窗格中。

引用 只读字段显示对 PSI 结构树视图节点的引用（如果有的话）。

未解析的引用显示为红色；相应的源代码片段也会以红色边框高亮显示。