搜索
首页开发工具sublime分享一款sublime text3支持JSX和es201x代码格式化的插件

下面由sublime教程栏目给大家推荐一款sublime text 3 支持JSX和es201x 代码格式化的插件,希望对需要的朋友有所帮助!

分享一款sublime text3支持JSX和es201x代码格式化的插件

推荐一款sublime text 3 支持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代码格式化的插件的详细内容。更多信息请关注PHP中文网其他相关文章!

声明
本文转载于:segmentfault。如有侵权,请联系admin@php.cn删除
sublime怎么运行sublime怎么运行Apr 16, 2025 am 09:39 AM

要运行 Sublime Text,需要下载、安装应用程序、购买许可证(可选),然后启动应用程序。新建或打开文件,即可开始编码。

sublime怎么汉化sublime怎么汉化Apr 16, 2025 am 09:36 AM

Sublime Text 可以通过以下步骤汉化:1. 下载汉化包;2. 安装汉化包;3. 重启 Sublime Text;4. 设置默认语言(可选);5. 校验汉化。

sublime插件怎么删除sublime插件怎么删除Apr 16, 2025 am 09:33 AM

删除 Sublime Text 中的插件有两种方法:通过插件管理器删除:选择要删除的插件并右键点击,选择 "删除"。手动删除:导航到用户数据目录,找到插件文件夹并将其拖到回收站或废纸篓中。

sublime怎么用gbk写代码sublime怎么用gbk写代码Apr 16, 2025 am 09:30 AM

在 Sublime Text 中使用 GBK 编码编写代码,需要:1. 设置项目编码为 GBK;2. 新建文件;3. 另存为时选择 GBK 编码;4. 使用 GBK 编码输入代码。

sublime怎么改为汉语sublime怎么改为汉语Apr 16, 2025 am 09:27 AM

sublime 可翻译成中文为:1. 崇高的,神圣的;2. 极好的,非凡的;3. 难以形容的,令人敬畏的;4. 崇高的思想。

sublime怎么获取注册码sublime怎么获取注册码Apr 16, 2025 am 09:24 AM

购买 Sublime Text 注册码的步骤如下:访问网站并选择“购买”。选择许可证类型并输入信息。付款并接收包含注册码的电子邮件。打开 Sublime Text,转到“许可证”菜单并粘贴注册码。单击“注册”以激活您的注册码和高级功能。

sublime怎么保存代码sublime怎么保存代码Apr 16, 2025 am 09:21 AM

Sublime Text 提供多种保存代码的方法,包括快捷键(Ctrl S)、菜单栏(File > Save)、工具栏(磁盘图标)和命令面板(Ctrl P)。此外,它还提供自动保存功能,可以定期自动保存打开的文件。

sublime怎么用箭头函数sublime怎么用箭头函数Apr 16, 2025 am 09:18 AM

使用箭头函数可以简洁且快速地在 Sublime Text 中定义匿名函数,语法为:(参数列表) => 表达式,优点包括简洁性、可读性、作用域继承和闭包功能,注意事项包括扩展运算符和 this 关键字限制,以及多行函数需要明确的 return 语句。

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
4 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
4 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
1 个月前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.聊天命令以及如何使用它们
1 个月前By尊渡假赌尊渡假赌尊渡假赌

热工具

螳螂BT

螳螂BT

Mantis是一个易于部署的基于Web的缺陷跟踪工具,用于帮助产品缺陷跟踪。它需要PHP、MySQL和一个Web服务器。请查看我们的演示和托管服务。

适用于 Eclipse 的 SAP NetWeaver 服务器适配器

适用于 Eclipse 的 SAP NetWeaver 服务器适配器

将Eclipse与SAP NetWeaver应用服务器集成。

VSCode Windows 64位 下载

VSCode Windows 64位 下载

微软推出的免费、功能强大的一款IDE编辑器

SublimeText3 英文版

SublimeText3 英文版

推荐:为Win版本,支持代码提示!

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

功能强大的PHP集成开发环境