彩票走势图

Webstorm入门教程:如何配置代码样式

翻译|使用教程|编辑:鲍佳佳|2020-12-29 09:57:41.847|阅读 638 次

概述:如果公司中存在某些编码准则,则在创建源代码时必须遵循这些准则。WebStorm可帮助您维护所需的代码样式。本文项目级别和 IDE级别(全局)讲述如何定义代码样式。

# 慧都年终大促·界面/图表报表/文档/IDE等千款热门软控件火热促销中 >>

WebStorm是一款深受广大程序员喜爱的 JavaScript 开发和Web前端开发工具,完美适应各种复杂客户端开发和Node.js的服务器端开发。

点击下载WebStorm最新试用版

如果公司中存在某些编码准则,则在创建源代码时必须遵循这些准则。WebStorm可帮助您维护所需的代码样式。

代码样式是在项目级别IDE级别(全局)定义的。

  • 在项目层面,设置被归入 "项目方案",该方案是预定义的,并以粗体标示。项目风格方案仅应用于当前项目。

    您可以使用 "Copy to IDE "命令将项目方案复制到IDE层。

  • 在 IDE 层面,设置被归入预定义的默认方案(以粗体标示),以及用户通过 Duplicate 命令创建的任何其他方案(以纯文本标示)。全局设置是在用户不想将代码风格设置与项目一起保留并共享时使用的。

    您可以使用 "Copy to Project "命令,将IDE方案复制到当前项目中。

配置语言的代码样式

  1. 在“Settings/Preferences”对话框中 Ctrl+Alt+S,转到“Editor | Code Style 然后打开您的编程语言页面。

  2. 选择代码样式方案,以用作所选语言的自定义代码样式的基础。

  3. 浏览所选语言页面的选项卡,并为其配置代码样式首选项。

从其他语言复制代码样式设置

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

  1. 在“Settings/Preferences”对话框中 Ctrl+Alt+S,转到"Editor | Code Style " 然后打开您的编程语言页面。

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

    设置其他语言的代码样式

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

要使用EditorConfig,请确保在 "Settings/Preferences | Plugins "页面上启用了EditorConfig捆绑插件,详见管理插件。

WebStorm允许您使用EditorConfig支持(默认情况下在“Settings/Preferences”对话框中 启用)来管理每个文件集的所有代码样式设置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>_前缀为where<lang>语言域ID(通常为小写语言名称),例如ij_java_blank_lines_after_imports。

可以将相同的选项定义为通用选项和特定于语言的选项,例如ij_<...>_brace_style。特定于语言的选项比通用或通用选项具有更高的优先级。

添加一个.editorconfig文件

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

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

  3. 要预览对代码样式设置的更改将如何影响实际的源文件,点击.editorconfig文件沟槽中的eye图标,并选择一个受其影响的源文件。预览将在右侧打开

    editorconfig预览

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

今天的内容就到这里,如果你想了解更多功能以及文章教程,点击免费获取!欢迎下载Webstorm体验最新功能并在下方评论区分享您对该产品的想法。您的反馈意见可帮助我们在以后的文章教程中找到正确的方向,慧都作为JetBrains的正版代理商现WebStorm正版授权最低仅售529
标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@cahobeh.cn

文章转载自:

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP