代码规范

502 阅读2分钟

1.为何要使用 JavaScript Standard 规范?

本规范特点之一是简洁。谁也不想为每个项目维护一份有成百上千行语句的代码风格配置文件。有此规范就够了。 本工具通过以下三种方式为你(及你的团队)节省大量时间:

  1. 无须配置。 史上最便捷的统一代码风格的方式,轻松拥有。
  2. 自动的代码格式化。 只需运行 standard --fix 从此和脏乱差的代码说再见。
  3. 提前发现风格及程序问题。 减少代码审查时的反反复复修改过程,节约时间。

2.Standard安装方式?

(1)使用本规范最便捷的方式是全局安装,运行:

npm install standard --global

(2)非全局的方式,针对某个项目进行安装:

npm install standard --save-dev

(3)检查项目风格,直接在npm test上去检查代码的规范

{
  "name": "my-cool-package",
  "devDependencies": {
    "standard": "*"
  },
  "scripts": {
    "test": "standard && node my-tests.js"
  }
}

3.Standard使用方式?

检查项目里所有JavaScript文件

$ standard
Error: Use JavaScript Standard Style
  lib/torrent.js:950:11: Expected '===' and instead saw '=='

可以跟上 glob 形式的路径参数,但记得带引号以确保 standard 工具正确解析,否则会被命令行解析。

$ standard "src/util/**/*.js" "test/**/*.js"

4.Standard的代码风格细则

文章链接:github.com/standard/st…

5.常用的编辑器内置插件

VSCODE编辑器
安装 vscode-standard
安装 vscode-standardjs-snippets 以获得 JS snippets。
安装 vscode-react-standard 以获得 React snippets。
WebStorm编辑器
编辑器里面已经自带了standard规范
可手动更改参考这篇文章:github.com/standard/st…

6.如何排除某些文件?

node_modules/coverage/vendor/*.min.jsbundle.js 这些目录,还有以 . 开头的文件(譬如 .git/)或者文件夹自动被排除在外。 .gitignore 里配置的文件也会自动排除掉。

有时你还是需要添加一些自定义的排除文件,可以在 package.json 里添加 standard.ignore 属性来配置:

"standard": {
  "ignore": [
    "**/out/",
    "/lib/select2/",
    "/lib/ckeditor/",
    "tmp.js"
  ]
}

7.使用的三方插件向全局暴露了变量,如何避免 "variable is not defined" 的错误提示?

一些三方库(比如 mocha)会向全局暴露变量(describeit)。这些变量或方法即没有定义,也没有被 require 进来,所以 standard 会报出变量未定义的警告(这种警告通常情况下是很有用的)。这种情况下我们想对这些全局变量禁用检查。

为了让 standard 检测通过(同时也使代码更加易懂),在文件顶部添加如下配置:

/* global myVar1, myVar2 */

但如果你需要添加的文件太多,这种方式就显得繁琐了。这种情况下,运行:

$ standard --global myVar1 --global myVar2

或者在 package.json 里配置:

{
  "standard": {
    "globals": [ "myVar1", "myVar2" ]
  }
}

注意:global 和 globals 效果一样