A-A+

【译】WebStorm快速入门指南

欢迎来到WebStorm!这个简短的指南旨在帮助你掌握的IDE。

请参考 Guided Tour About WebStorm User Interface 来了解WebStorm 界面风格的独特性。


你开始之前

你可以在安装WebStorm之后用正确的姿势开启工作。它提供了配置以及随时可用的本地开发环境,支持包括 Node.js, Meteor, AngularJS, CoffeeScript, TypeScript, Dart, Sass以及更多。

WebStorm 是跨平台的,在Windows、Mac OS X、和Linux上都可以运行。


初始配置

当你第一次启动 WebStorm,你会被询问是否使用以前的版本以及如何处理配置。出于教程考虑,假设不存在先前的版本,然后单击OK:

接下来,你将进入 WebStorm 许可激活对话框,你必须指定特定的许可:

您指定您的许可后, WebStorm 显示初始设置对话框。在这里有必须选择keymap以及你想使用的IDE和编辑的主题。单击向下箭头(单击显示预览)来预览你选择的看起来怎么样:

注意,WebStorm 有几个预定义的 keymap :为那些喜欢Eclipse或VisualStudio,Emacs粉、GNOME、KDE以及更多。在 Keymap 页面的 Settings/Preferences对话框探索可供使用的 keymaps列表 。

如果随后你觉得起初的选择是错误的,您也可以更改设置。了解更多关于keymap的配置,请参阅 Configuring Keyboard Shortcuts 部分。

你也可以改变IDE主题和编辑主题 后来。

还有一个ideavim插件用于提供webstormvi/vim/gvim仿真。请遵循这些指令安装它。

从欢迎屏幕设置默认值

此外,如果这是你第一次打开(或者如果您没有打开的项目),你会看见 Welcome screen:

如果您单击 Configure 。WebStorm 会显示下拉列表,显示您设置 /偏好设置、插件,导入和导出设置,并检查更新。选择 Settings/Preferences ,参见 Settings/Preferences对话框,看这个对话框。——它Default Settings/Preferences.。

这意味着什么?这些设置将在您每创建一个新项目的时候都起作用。

有关默认项目的设置,都会有图标标记。

编辑设置适用于你的工作环境。

例如,您希望在编辑器中总是显示行号。在 Settings/Preferences 对话框中,展开 Editor ,在 Appearance 页面,选中复选框 Show line numbers:

假设您希望为编辑器使用某种特有的颜色方案,您不满意默认的建议颜色。好的,选择基础方案、创建或复制它,然后将颜色改变(默认方案不可编辑)。

您还可以设置偏爱的字体大小,这个操作是 Settings/Preferences 对话框 字体页Colors and Fonts 中。首先,您必须创建一个方案的副本,如果没有这样做,然后指定了期望的字体的大小。该字体大小将应用于当前编辑和最近打开的编辑。然而,这并不影响IDE组件的字体大小。

注意,你总可以在预览面板看到实验结果,:


更改设置/首选项后

要改变项目中IDE的界面外观和编辑器的配色方案,你必须打开 Settings/Preferences(按 Ctrl+Alt+S或者在 main toolbar单击settings图标)。

例如,你想改变IDE的界面外观。注意,WebStorm 自带一些预定义的主题。主题设置取决于你的平台。你可以在 Settings/Preferences 对话框的 Appearance 页面你选择的主题。

这里展示了如何更改IDE的主题:

  1. 在主工具栏上,单击settings或按 Ctrl+Alt+S

2.展开 Appearance and Behavior,单击 Appearance。

3.在 Appearance页面,从下拉列表主题中选择你喜欢的主题:

注释对话框顶部的reset链接-如果你改变想法了,点击它回复到变化前的状态。还注意到当你鼠标指针点击按钮,按钮变为启用,:

你也可以改变 WebStorm的外观及其它设置,例如窗口的动作。
4.应用更改。您或许被建议重启IDE(例如,当您对 Darcula进行主题更换)。
OK,WebStorm 主题已经改变,但你仍不满意编辑器中代码的样式,而在代码编辑器中。例如,你想要用一种颜色高亮当前行。让我们配置它。

1.再一次,在主工具栏上单击settings打开 Settings/Preferences 对话框中,展开编辑器,然后单击 Colors and Fonts。
请注意,您不能更改预先定义的颜色方案——你必须首先创建一个副本:

2。单击 Save As按钮,.输入你的新配色方案:

新的颜色方案是可编辑的,你可以改变以适合你的口味。
3.在 Colors and Fonts下,在组件列表中单击 General、展开编辑,定位到Caret row。
单击“背景颜色”片段,打开color picker:

在对话框中,选择你期望的新颜色,点击 choose。
对了,你已经注意到,其中一些节点被用图标标记,这意味着在这些页面的设置适用于当前项目。没有此图标的页面的设置适合整个工作环境。


L&F主题与编辑器颜色方案的不同
IDE主题和 color scheme of the editor.的主要不同。前者涉及整个IDE,后者则涉及仅在编辑器。很可能有一个黑色的IDE主题(例如、darcula),和一个淡色的 编辑器方案(例如,默认)。这样做,所有 WebStorm 组件 是一种配色方案,编辑区面板是一种:

标签:

给我留言

Copyright © 花未全开月未圆 保留所有权利.   Theme  Ality

用户登录