JavaScript Standard Style
English • Español (Latinoamérica) • Italiano (Italian) • 한국어 (Korean) • Português (Brasil) • 简体中文 (Simplified Chinese) • 繁體中文 (Taiwanese Mandarin)
](https://www.npmjs.com) | [
](https://github.com) | [
](https://opbeat.com) | [
](http://www.nearform.com) | [
](https://www.brave.com) |
|---|---|---|---|---|
| [
](https://zeit.co) | [
](https://www.zendesk.com) | [
](https://www.mongodb.com) | [
](https://www.typeform.com) | [
](https://gds.blog.gov.uk) |
|---|---|---|---|---|
[
](http://expressjs.com) | [
](https://webtorrent.io) | [
](https://ipfs.io) | [
](https://datproject.org) | [
](https://bitcoinjs.org) |
|---|---|---|---|---|
[
](https://atom.io) | [
](http://electron.atom.io) | [
](https://voltra.co) | [
](https://www.treasuredata.com) | [
](https://clevertech.biz) |
|---|---|---|---|---|
[
](https://www.apstudynotes.org) | [
](https://www.optiopay.com) | [
](https://www.jlrtechincubator.com/jlrti/) | [
](https://www.bustle.com) | [
](https://www.zentrick.com) |
|---|---|---|---|---|
[
](https://nodesource.com) | [
](https://greenkeeper.io) | [
](https://karma-runner.github.io) | [
](https://www.taser.com) |
|---|---|---|---|
除公司组织外，[很多个人](https://raw.githubusercontent.com/feross/standard-packages/master/all.json)也在项目中使用，这里就不一一罗列了。
并且 `standard` 在 GitHub 的[代码检查类工具](https://github.com/showcases/clean-code-linters) 展示列表中也排名第一。
## 有现成的编辑器插件吗？
首先安装 `standard`。剩下的就是不同编译器安装对应的插件：
### Sublime Text
通过 **[Package Control][sublime-1]**，安装 **[SublimeLinter][sublime-2]** 和
**[SublimeLinter-contrib-standard][sublime-3]**。
如果想要保存时自动格式化，还需安装 **[StandardFormat][sublime-4]**。
[sublime-1]: https://packagecontrol.io/
[sublime-2]: http://www.sublimelinter.com/en/latest/
[sublime-3]: https://packagecontrol.io/packages/SublimeLinter-contrib-standard
[sublime-4]: https://packagecontrol.io/packages/StandardFormat
### Atom
安装 **[linter-js-standard][atom-1]**。
如果想要保存时自动格式化，还需安装 **[standard-formatter][atom-2]**。安装 **[standardjs-snippets][atom-3]** 可以获得 snippets 特性。
[atom-1]: https://atom.io/packages/linter-js-standard
[atom-2]: https://atom.io/packages/standard-formatter
[atom-3]: https://atom.io/packages/standardjs-snippets
### Visual Studio Code
安装 **[vscode-standardjs][vscode-1]**（已经包含了自动格式化）。
安装 **[vscode-standardjs-snippets][vscode-2]** 以获得 JS snippets。安装 **[vscode-react-standard][vscode-3]** 以获得 React snippets。
[vscode-1]: https://marketplace.visualstudio.com/items/chenxsan.vscode-standardjs
[vscode-2]: https://marketplace.visualstudio.com/items?itemName=capaj.vscode-standardjs-snippets
[vscode-3]: https://marketplace.visualstudio.com/items/TimonVS.ReactSnippetsStandard
### Vim
安装 **[Syntastic][vim-1]** 并添加如下配置到 `.vimrc`：
```vim
let g:syntastic_javascript_checkers = ['standard']
```
如果想要保存时自动格式化，添加以下配置到 `.vimrc`：
```vim
autocmd bufwritepost *.js silent !standard --fix %
set autoread
```
[vim-1]: https://github.com/scrooloose/syntastic
### Emacs
安装 **[Flycheck][emacs-1]** 后查看 **[manual][emacs-2]** 以了解如何在项目在启用。
[emacs-1]: http://www.flycheck.org
[emacs-2]: http://www.flycheck.org/en/latest/user/installation.html
### Brackets
插件中搜索 **["Standard Code Style"][brackets-1]** 然后点击 "Install"。
[brackets-1]: https://github.com/ishamf/brackets-standard/
### WebStorm (PhpStorm, IntelliJ, RubyMine, JetBrains 等 jetbrains 全家桶系列)
WebStorm [最近宣布](https://blog.jetbrains.com/webstorm/2017/01/webstorm-2017-1-eap-171-2272/)在其 IDE 中
自带 `standard` 规范。
但是如果你仍然想自己动手配置，[那么请看此教程][webstorm-1]。此教程适用于 JetBrains 全家桶，包括 PhpStorm、IntelliJ、RubyMine 等。
[webstorm-1]: docs/webstorm.md
## 有专属徽章可以用来放到项目的 README 文件中吗？
必需的！如果你的项目使用了 `standard` 规范，可以任选一个下面的徽章放入项目中来进行展示。
[](https://github.com/standard/standard)
```md
[](https://github.com/standard/standard)
```
[](https://standardjs.com)
```md
[](https://standardjs.com)
```
## 如果我不同意某条规则，可以改吗？
不行。制定这套 `standard` 规范的目的就是让大家都不必再花时间浪费在[无谓的][bikeshedding]代码风格之争上面了。关于缩进该用制表符还是空格这个问题已经争论了很久了，永远也没有答案。争论这个都可以把需求提前写完了。遵循 `standard` 规范，你就不用再犹豫了，毕竟不管怎样争论总归会选择一种风格的。希望大家也能在个人语义和普适价值上做一个权衡。
如果你非要自己去配置成百上千项的 ESLint 规则，那你可以直接使用
[eslint-config-standard](https://github.com/standard/eslint-config-standard) 来将个人配置包装在上层。
小贴士：选择 `standard` 然后保持吧。把时间留下来解决其他有意义的问题！\(^____^)/
[bikeshedding]: https://www.freebsd.org/doc/en/books/faq/misc.html#bikeshed-painting
## 毕竟这不是一份正式的 Web 规范啊！
确实！这份规范不隶属于任何官方组织，所以才叫 `feross/standard` 而不是 `ECMA/standard` 嘛。
而 `standard` (标准) 一词在这里不局限于 “web 标准” :-) 。 举个例子：
- 这个模块帮助我们将代码维持在一个*高的水准（standard of quality）*
- 这个模块确定项目中的新手遵循一些基本的*样式规范（style standards）*
## 有自动格式化工具么？
当然！你可以使用 `standard --fix` 来纠正大部分的代码问题。
`standard --fix` 可以修正大部分约定俗成的问题，但有些错误（譬如忘记了错误处理）只能手动去修复了。
为了使用方便，`standard` 会在检测到有能够自动被修复的问题的时候，给出相应的提示 "`运行 standard --fix 来自动修正一些问题`"。
## 如何排除某些文件？
`node_modules/`、`coverage/`、`vendor/`、`*.min.js`、`bundle.js` 这些目录，还有以 `.` 开头的文件（譬如 `.git/`）或者文件夹自动被排除在外。
`.gitignore` 里配置的文件也会自动排除掉。
有时你还是需要添加一些自定义的排除文件，可以在 `package.json` 里添加 `standard.ignore` 属性来配置：
```json
"standard": {
"ignore": [
"**/out/",
"/lib/select2/",
"/lib/ckeditor/",
"tmp.js"
]
}
```
## 如何隐藏某类警告？
很少的情况下你需要绕开 `standard` 以隐藏某些警告信息。
JavaScript Standard 代码规范底层使用的是 [ESLint](http://eslint.org/)。所以如果你想隐藏某些警告，方法和使用 ESLint 时一样。
打印详细信息（这样你就能找到你想隐藏的警告在配置中对应的名称了）：
```bash
$ standard --verbose
Error: Use JavaScript Standard Style
routes/error.js:20:36: 'file' was used before it was defined. (no-use-before-define)
```
对某一行禁用**所有规则**：
```js
file = 'I know what I am doing' // eslint-disable-line
```
或者，**只禁**用 `"no-use-before-define"` 这条规则：
```js
file = 'I know what I am doing' // eslint-disable-line no-use-before-define
```
或者，对**多行**禁用 `"no-use-before-define"` 这一规则：
```js
/* eslint-disable no-use-before-define */
console.log('offending code goes here...')
console.log('offending code goes here...')
console.log('offending code goes here...')
/* eslint-enable no-use-before-define */
```
## 使用的三方插件向全局暴露了变量，如何避免 "variable is not defined" 的错误提示？
一些三方库（比如 `mocha`）会向全局暴露变量（`describe`、`it`）。这些变量或方法即没有定义，也没有被 `require` 进来，所以 `standard` 会报出变量未定义的警告（这种警告通常情况下是很有用的）。这种情况下我们想对这些全局变量禁用检查。
为了让 `standard` 检测通过（同时也使代码更加易懂），在文件顶部添加如下配置：
```js
/* global myVar1, myVar2 */
```
但如果你需要添加的文件太多，这种方式就显得繁琐了。这种情况下，运行：
```bash
$ standard --global myVar1 --global myVar2
```
或者在 `package.json` 里配置：
```json
{
"standard": {
"globals": [ "myVar1", "myVar2" ]
}
}
```
*注意：`global` 和 `globals` 效果一样*
## 如何才能使用处于实验阶段的 JavaScript 特性（譬如 ES Next）？
`standard` 支持最新的 ECMAScript 特性，ES8（ES2017），包括处于 “Stage 4” 仍在提案阶段的特性。
为了支持实验性的特性，`standard` 支持自定义 JavaScript 解析器。添加自定义解析器前请思考一下必要性。
从 npm 安装并使用自定义的解析器（示例：`npm install babel-eslint`）：
```bash
$ standard --parser babel-eslint
```
或者将其添加到 `package.json` 配置中：
```json
{
"standard": {
"parser": "babel-eslint"
}
}
```
如果全局安装（`npm install standard --global`）了 `standard` 的话，那么请确保 `babel-eslint` 也用 `npm install babel-eslint --global` 全局安装。
## 我能使用其他 JavaScript 变种吗，例如 Flow？
同样地，想要使用一个 JS 变种之前，先考虑添加和使用它所带来的复杂度看是否值得这么去做。
`standard` 支持 ESLint 插件。在 `standard` 处理代码前，使用任何一个插件来将代码编译成合法的 JS 即可。 从 npm 安装一个自定义的解析器 (示例：`npm install eslint-plugin-flowtype`) 然后运行：
```bash
$ standard --plugin flowtype
```
或者添加到`package.json`:
```json
{
"standard": {
"plugins": [ "flowtype" ]
}
}
```
如果全局安装（`npm install standard --global`）了 `standard` 的话，那么请确保 `eslint-plugin-flowtype` 也用 `npm install eslint-plugin-flowtype --global` 全局安装。
*注意：`plugin` 和 `plugins` 等价*
## 如何与 Mocha，Jasmine 和 QUnit 这些测试工具搭配工作?
为了能让 mocha 在你的测试文件中工作，将以下配置添加到测试文件头部：
```js
/* eslint-env mocha */
```
或者运行：
```bash
$ standard --env mocha
```
上面 `mocha` 也可以是 `jasmine`, `qunit`, `phantomjs` 等同类工具。这里有个来自 ESLint 的完整列表
[环境配置](http://eslint.org/docs/user-guide/configuring.html#specifying-environments)
文档。环境中所有可用的全局变量可以这个
[globals](https://github.com/sindresorhus/globals/blob/master/globals.json) npm 包中查到。
*注意: `env` 与 `envs` 用哪个都一样。*
## Web Workers 有考虑过么？
添加以下注释到文件头部：
```js
/* eslint-env serviceworker */
```
这样可以让 `standard` 知道 `self` 是 web worker 中的全局变量（同时也让人更容易看懂）。
## Markdown 或者 HTML 文件中的代码能检查到吗？
可以使用 [`standard-markdown`](https://www.npmjs.com/package/standard-markdown) 来检查 Markdown 里的区位码。
此外，也有 ESLint 插件可以检查 Markdown、HTML 等其他类型文件中的代码：
检查 Markdown 文件中的代码，可以用这个 ESLint 插件：
```bash
$ npm install eslint-plugin-markdown
```
然后运行以下命令来检查文件代码块中的代码：
```bash
$ standard --plugin markdown '**/*.md'
```
HTML 文件可以下面这个插件：
```bash
$ npm install eslint-plugin-html
```
然后运行以下命令来检查包含在 `