推荐一款sublime text 3 支持JSX和es201x 代码格式化的插件

2024年3月3日 239次阅读 来源: Sarufarr

最近开始撸
React的时候，一直使用的sublime text3着实让强迫症的我难受至极，本身不支持
JSX的高亮，安装完
Babel之后新的问题来了，格式化插件挂了。。。

前前后后尝试了两三个插件（jsfmt etc.），都不太理想。
esformatter-jsx可以使用，但是那个对JSX的缩进，还有对诸如switch语句的诡异缩进，糟心。
终于在准备换IDE的时候看到了VSCode格式化插件的一个配置项有esformatter-jsx，还可以选择prettier。

prettier官网（科学上网）

可以看到Facebook在用它优化
React项目的代码，没深究。

执行npm i -g prettier
下载到的包里有个bin-prettier.js，这就是本体了。

sublime text3 直接在package control搜索prettier下载，打开它的User配置项加入如下保存即可。

注意修改你本地的
node和
node_modules路径

{
  "debug": false,
  "prettier_cli_path": "/usr/local/lib/node_modules/prettier/bin-prettier.js",
  "node_path": "/usr/local/bin/node",
  "auto_format_on_save": false,
  "auto_format_on_save_excludes": [],
  "allow_inline_formatting": false,
  "custom_file_extensions": [],
  "max_file_size_limit": -1,
  "additional_cli_args": {},
  "prettier_options": {
    "printWidth": 80,
    "singleQuote": false,
    "trailingComma": "none",
    "bracketSpacing": true,
    "jsxBracketSameLine": false,
    "parser": "babylon",
    "semi": true,
    "requirePragma": false,
    "proseWrap": "preserve",
    "arrowParens": "avoid"
  }
}

在快捷键配置中加入

{
  "keys": ["super+shift+c"],
  "command": "format_javascript"
}

具体可以去github看插件作者的Readme

插件的功能不是全部功能，可以在命令行使用指令格式化代码，（也可以直接在项目中引用？）

    原文作者：Sarufarr
    原文地址: https://segmentfault.com/a/1190000013064665
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞