WebStorm 2021.1 Help

配置代码风格

如果公司中存在某些编码准则，则在创建源代码时必须遵循这些准则。WebStorm 帮助您保持所需的代码风格。

IDE 带有两个预定义的方案：项目方案和默认方案。

  • 在项目方案中，您配置的设置仅适用于您当前的项目。

    这些设置存储在.idea下的codeStyles文件夹中，并通过 VCS 与项目一起共享。

    在您修改项目的代码样式设置后，IDE 会创建该文件夹。

  • 在默认方案（IDE 级方案）中，您配置的设置适用于选择了默认代码样式方案的所有现有项目。

    这些设置存储在WebStorm配置目录下的codestyles 文件夹中，不通过 VCS 共享。

如果您想使用项目代码样式方案作为您的默认方案，您可以将其复制到 IDE 级别。另一种方法也是可能的：您可以使用 IDE 级别方案中的设置覆盖当前项目设置，并与团队的其他成员共享它们。

配置方案

在 WebStorm 中，代码样式设置是特定于语言的，因此您需要为您在项目中使用的每种语言单独配置它们。您还可以从一种语言复制设置并将其应用到另一种语言。

配置语言的代码样式

  1. 按Ctrl+Alt+S打开 IDE 设置并选择Editor | 代码风格。

    要为新项目配置方案，请转到文件 | 新项目设置 | 新项目的设置/首选项 | 编辑 | 代码风格。

  2. 选择要为其配置代码样式的语言。

  3. 选择您要配置的代码样式方案：项目方案或IDE 级方案之一。

  4. 浏览选项卡并配置代码样式首选项。

    使用对话框的右侧部分预览更改。更改设置时，预览区域中会出现一个或多个闪烁区域，强调更改。

应用其他语言的代码样式

对于大多数受支持的语言，您可以从其他语言或框架复制代码样式设置。

  1. 按Ctrl+Alt+S打开 IDE 设置并选择Editor | 代码风格。

    要为新项目配置方案，请转到文件 | 新项目设置 | 新项目的设置/首选项 | 编辑 | 代码风格。

  2. 选择要为其配置代码样式的语言。

  3. 选择要修改的代码样式方案：项目方案或IDE 级方案之一。

  4. 单击右上角的设置自。

    仅当可以应用其他语言的代码样式设置时，才会显示该链接。

  5. 从出现的列表中，选择要从中复制代码样式的语言。

    从另一种语言设置代码样式

使用 EditorConfig 在目录级别管理代码样式

WebStorm 允许您通过EditorConfig支持管理每组文件的所有代码样式设置（默认情况下在设置/首选项对话框 ( Ctrl+Alt+S) 中启用）。您需要做的就是在根目录中放置一个.editorconfig文件，其中包含您要定义其代码样式的文件。您可以根据需要在项目中拥有任意数量的.editorconfig文件，因此您可以为不同的模块指定不同的样式。

.editorconfig文件中的所有选项都应用于它所在的目录以及当前项目代码样式之上的所有子目录。如果 中未定义任何内容.editorconfig，则从项目设置中获取。

.editorconfig文件中的所有选项分为以下几类：

  • 标准选项，例如indent_size、indent_style等。这些选项没有任何特定于域的前缀。

  • 具有ij_前缀并适用于所有语言的通用 IntelliJ 选项：

    • ij_visual_guides

    • ij_formatter_off_tag

    • ij_formatter_on_tag

    • ij_formatter_tags_enabled

    • ij_wrap_on_typing

    • ij_continuation_indent_size

    • ij_smart_tabs

  • 许多（但不是全部）语言支持的通用 IntelliJ 选项。它们以ij_any前缀开头，例如ij_any_brace_style.

  • IntelliJ 语言特定选项以ij_<lang>_前缀开头，其中<lang>是语言域 ID（通常是小写语言名称），例如ij_java_blank_lines_after_imports.

添加 .editorconfig 文件

  1. 在Project视图中，右键单击包含要定义其代码样式的文件的源目录，然后选择New | 上下文菜单中的EditorConfig。

  2. 选择您要定义的属性，以便 WebStorm 为它们创建存根，或者将所有复选框留空以手动添加所需的属性。

  3. 要预览对代码样式设置的更改将如何影响实际源文件，请单击.editorconfig眼睛图标文件的装订线并选择受其影响的源文件。预览将在右侧打开。

    编辑器配置预览

    您可以在预览窗格中进行更改，以尝试测试您的配置更改是如何反映的，而不必担心对源代码进行不必要的更改：当您关闭.editorconfig文件时，所有这些更改都会被丢弃。

最后修改：2022 年 1 月 17 日
配置 IDE 颜色和字体