Horizon/Javascript/EditorConfig

JavaScript 编辑器配置

以下说明设置几个流行的编辑器，以便按照 Horizon 实践开发 JavaScript。这些说明为每个编辑器设置了 JSHint 和源代码格式化。

Eclipse

1. 要设置 JavaScript 的格式化程序，首先转到此处并复制内容，然后保存为 Horizon_JS_Formatter.xml。

2. 窗口 > 首选项，JavaScript > 代码风格 > 格式化程序。

3. 导入 Horizon_JS_Formatter.xml。

 This formatter is the Eclipse default for JS, with only the following changes:
 - Indentation is 2 spaces
 - Indentation inside switch statements
 - White Space > Expressions > Object initializers: no space before colon
 - No formatting of comments
 - This formatter is close to the Sublime formatter, though further tweaking could make it closer. Eclipse is a bit more aggressive than Sublime's “JavaScript Beautification” in   adding/removing newlines in source.

4. 在 Eclipse Marketplace 中找到 JSHint（帮助 -> Eclipse Marketplace...）。搜索 jshint 并安装该插件。

5. 转到此处并复制 .jshintrc 的内容，然后将其复制到剪贴板。

6. 打开窗口->首选项，然后选择 JSHint->配置。粘贴 .jshintrc 的内容。保存它。</nowiki>

请注意，可以在 Eclipse 中为每个项目拥有不同的 JSHint 配置。为此，打开项目的属性，然后单击左侧的 JSHint。

Sublime

开始之前：Sublime Text 3 应该已经安装。请参阅 https://text.sublime.net.cn/3。如果您在 Sublime 的首选项下看不到“Package Control”，则安装 Package Control：https://sublime.wbond.net/installation

Node 应该已经安装。如果未安装

sudo apt-get install nodejs

sudo apt-get install npm

sudo ln -s /usr/bin/nodejs /usr/bin/node

开始吧

1. 使用 Node 安装 jshint。假设您位于 ~ 目录中

npm install jshint

sudo ln -s ~/node_modules/jshint/bin/jshint /usr/bin/jshint

在命令行中，键入“where jshint”（Windows）或“which jshint”（Linux），以确保它位于路径上。

2. 转到此处并复制 .jshintrc 的内容，然后将其保存到编辑的文件之上某个级别的目录中的 .jshintrc 文件中——例如，顶层 horizon 目录。对于 Windows，将其重命名为 jshint.conf。

3. 在 Sublime 中，首选项 > Package Control > 安装包。等待片刻，列出所有包，然后搜索并选择 Javascript Beautify。

4. 首选项 > 包设置 > JavaScript Beautify > 用户设置。粘贴以下内容并保存

{
"indent_size": 2,
"use_original_indentation": true,
"format_on_save": false
}

use_original_indentation will allow you to format non-Horizon js files without changing their indentation to 2.

format_on_save is a very nice feature. However, it is set to false to safeguard against accidentally reformatting an entire file when you are making a surgical change to it. See the   notes above on formatting.

5. 首选项 > Package Control > 安装包 > (等待片刻列出) > SublimeLinter。

6. 首选项 > Package Control > 安装包 > 等待片刻列出 > SublimeLinter-jshint。

7. 确保 JSHint 正在工作。在 .js 文件中键入以下内容，并查看它是否报错：eval(“i=1”);

如果收到警告，则表示它正在工作，您已完成。

如果 JSHint 无法工作，您可以尝试以下故障排除步骤。

1. 首选项 > 包设置 > SublimeLinter > 用户设置

2. 确保它通过适当设置“args”找到 .jshintrc。例如：“linters”：{

  "jshint": {
  "@disable": false,
  "args": [
    "--config",
    "/home/randy/horizon/.jshintrc"
  ],
  "excludes": []

对于 Windows，路径如下所示

"args": [
     "--config",
     "C:\\tools\\jshint.conf"
 ],

3. 确保它通过适当设置“paths”找到 jshint，以匹配“which jshint”。例如：“paths”：{

"linux": [
"/home/randy/ibm/node/bin"
],

4. 在进行更改并保存设置后，必须清除 SublimeLinter 缓存才能使更改生效：工具 > SublimeLinter > 清除缓存。然后关闭并重新打开 Sublime。

同时，您可能还想安装一些其他好的插件：SublimeLinter-pep8、SideBarEnhancements、Git 和 GitGutter。

PyCharm 和 WebStorm

1. 从欢迎屏幕，配置 > 设置；JavaScript > 代码质量工具 > JSHint。转到此处并复制 .jshintrc 的内容，然后将其保存到编辑的文件之上某个级别的目录中的 .jshintrc 文件中——例如，顶层 horizon 目录。对于 Windows，将其重命名为 jshint.conf。

2. 从欢迎屏幕，配置 > 设置；JavaScript > 代码质量工具 > JSHint。

3. 选中启用。

4. 选中“使用配置文件”。它将默认设置为 .jshintrc，它将在您正在编辑的代码的超目录中找到它。

5. 单击应用。

6. 确保未启用 JSLint（在 JSHint 上方），然后单击确定。

7. 通过键入来查看 jshint 是否正在工作

eval(“i=1”);

如果 PyCharm 抱怨找不到配置文件，请返回设置并手动找到该文件。有关更多详细信息，请参阅 http://www.jetbrains.com/pycharm/webhelp/using-javascript-code-quality-tools.html。

8. 从欢迎屏幕，配置 > 设置；代码风格 > JavaScript。

The following minor changes to the default settings will bring the JetBrain formatter into closer alignment with the others.
In the “Tabs and Indents” tab, change the three tabbing numbers to “2”.
In the Spaces tab, uncheck “In function expression”.

9. 单击确定。

Notepad++

1. 转到此处并复制 .jshintrc 的内容，将其粘贴到文本编辑器中，然后连接所有行。（您可以通过全局更改所有换行符为空或选择要连接的行，然后选择编辑 → 行操作 → 连接行来执行此操作。）删除开括号和闭括号以及“freeze”选项。将生成的长行复制到剪贴板。

2. 打开插件 > 插件管理器 > 显示插件管理器

3. 选择 JSLint 和 JSTool；单击安装。

4. 插件 > JSTool > 选项。将缩进 o 设置为“2”个空格而不是制表符，然后单击确定。

Use Plugins > JSTool > JSFormat to reformat.

Be warned that this formatter is significantly different from the others, with no options to customize it. If anyone knows of a better plugin for Notepad++ formatting, let me know.

5. 插件 > JSLint > 选项。

6. 在顶部下拉列表中选择 JSHint。

7. 单击“清除所有选项”。

8. 将步骤 1 中的剪贴板中的字符串粘贴到“附加”字段中。单击确定。

Use Plugins > JSLint > “JSLint current file” to check a file.