Sublime Text 3 配置 JsPrettier

系统参数：
MacOS 10.12.6
Node.js: v8.2.1
yarn: 1.3.2

Prettier是代码格式化工具，支持 JavaScript, TypeScript, CSS, Less, SCSS, JSON, markdown。

Prettier可以在多个平台上使用，即可以在命令行中去格式化代码，又可以在 Sublime 和 VS Code 编辑器中去格式化。经过代码格式化，可以保证代码的风格统一与整洁清晰。

全局安装 npm 包 prettier

yarn global add prettier

sublime 包安装

package install

JsPrettier

配置按键

shift + super + p
选 Preferences: Key Bindings
这里绑定了 "super+shift+f"，可以自己选择喜欢的快捷键。

[
  {
    "keys": ["super+shift+f"],
    "command": "js_prettier"
  }
]

JsPrettier 自己的配置

Sublime Text > Preferences > Package Settings > JsPrettier > Settings - User

其中

• prettier_cli_path 是 prettier 的调用地址，可以在命令行用 which prettier 查到

• node_path 是 node.js 的地址可以在命令行用 which node 查到

• "auto_format_on_save": false 保存时格式化不开，一般手动格式化。

• prettier_options.printWidth : 100 每一行的预设宽度设置为100。这个宽度涉及到Prettier判断是否要把一行代码换行。这里设置 100 比较大一些，也可以设置成 80 等。

• prettier_options.singleQuote : true 保留单引号，不要把单引号格式化成双引号。

• prettier_options.trailingComma : none 对于 json 中最后一个键值对的后面，是否要加逗号（trailing comma）。这里是不要加，设置成 none。但是 Airbnb 的格式规范是最后一行JSON也要加逗号，因为这样把最后一个键值对向上移动多行，也不会造成JSON 的错误，这样代码更健壮。

• prettier_options.bracketSpacing : true 括号里面的空间要不要进行格式化，可以选择让 prettier 进行格式化控制，看个人喜好，如果觉得 prettier 不如自己控制好，可以设置为 false。

• prettier_options.parser : babylon prettier的编译器一般是两种选择 babylon 或者 flow，这里就用默认的 babylon，babylon的强势就是格式解析。作为另外一个选择 flow，主要是做静态检查会更多。但是 flow 可能存在一些 utf8 字符的 bug （参照prettier parser, difference between babylon and flow #1180），所以尽量使用 babylon。另外这个选项还有 typescript 和 css，当检测到是这两种文件类型是，prettier 会自动从 babylon
  切换到 typescript 和 css 来做解析。

个人的 JsPrettier 代码配置如下，供参考：

{
  "debug": false,
  "prettier_cli_path": "/usr/local/bin/prettier",
  "node_path": "/Users/pro/.nvm/versions/node/v8.2.1/bin/node",
  "auto_format_on_save": false,
  "prettier_options": {
    "printWidth": 120,
    "singleQuote": true,
    "trailingComma": "none",
    "bracketSpacing": true,
    "jsxBracketSameLine": false,
    "parser": "babylon",
    "semi": true,
    "requirePragma": false
  }
}

另：作者 James Long 在今年从火狐出来，专心做 Prettier，匠人精神让人欣赏。他对自己的想法写在了文章中：A Prettier JavaScript Formatter, January 10, 2017。