千家信息网

sublime text3支持JSX和es201x代码格式化的插件是什么

发表于:2025-01-31 作者:千家信息网编辑
千家信息网最后更新 2025年01月31日,小编给大家分享一下sublime text3支持JSX和es201x代码格式化的插件是什么,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!最近开始撸React的时候,一直使用的subl
千家信息网最后更新 2025年01月31日sublime text3支持JSX和es201x代码格式化的插件是什么

小编给大家分享一下sublime text3支持JSX和es201x代码格式化的插件是什么,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!

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

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

prettier官网(科学上网):https://prettier.io/docs/en/install.html
可以看到Facebook在用它优化React项目的代码,没深究。

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

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

注意修改你本地的nodenode_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

插件的功能不是全部功能,可以在命令行使用指令格式化代码,(也可以直接在项目中引用?)

看完了这篇文章,相信你对"sublime text3支持JSX和es201x代码格式化的插件是什么"有了一定的了解,如果想了解更多相关知识,欢迎关注行业资讯频道,感谢各位的阅读!

0