当前位置: 首页 > news >正文

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

最近开始撸 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配置项加入如下保存即可。

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

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

相关文章:

  • 浅谈RxJava
  • android studio 3.0 Ndk 开发- 利用增量更新进行 apk的覆盖安装
  • Teamviewer原理和阻止方法
  • 【BIEE】11_根据显示指标展示不同报表
  • 流程(上)
  • 好领导:提升领导威信力的110个管理奥秘
  • 我的重构第二步
  • 部署eolinker开源版接口管理
  • 基于django的生成二维码的接口
  • 09-移动端开发教程-Sass入门
  • while循环按行读文件的方式总结
  • ElasticSearch「1」本地安裝Elasticsearch 6.0.1 + Elasticsearch-head插件
  • 2018/02/09
  • PhysicsBasedAnimation学习
  • 一些基于React、Vue、Node.js、MongoDB技术栈的实践项目
  • 【跃迁之路】【699天】程序员高效学习方法论探索系列(实验阶段456-2019.1.19)...
  • ➹使用webpack配置多页面应用(MPA)
  • gulp 教程
  • Java小白进阶笔记(3)-初级面向对象
  • js继承的实现方法
  • mysql外键的使用
  • PHP的Ev教程三(Periodic watcher)
  • Redis中的lru算法实现
  • web标准化(下)
  • Windows Containers 大冒险: 容器网络
  • 技术攻略】php设计模式(一):简介及创建型模式
  • 看完九篇字体系列的文章,你还觉得我是在说字体?
  • 删除表内多余的重复数据
  • 体验javascript之美-第五课 匿名函数自执行和闭包是一回事儿吗?
  • 一加3T解锁OEM、刷入TWRP、第三方ROM以及ROOT
  • 异常机制详解
  • 你对linux中grep命令知道多少?
  • “十年磨一剑”--有赞的HBase平台实践和应用之路 ...
  • 移动端高清、多屏适配方案
  • ​ ​Redis(五)主从复制:主从模式介绍、配置、拓扑(一主一从结构、一主多从结构、树形主从结构)、原理(复制过程、​​​​​​​数据同步psync)、总结
  • ​【原创】基于SSM的酒店预约管理系统(酒店管理系统毕业设计)
  • ​Linux·i2c驱动架构​
  • ### Cause: com.mysql.jdbc.exceptions.jdbc4.MySQLTr
  • (aiohttp-asyncio-FFmpeg-Docker-SRS)实现异步摄像头转码服务器
  • (Bean工厂的后处理器入门)学习Spring的第七天
  • (cljs/run-at (JSVM. :browser) 搭建刚好可用的开发环境!)
  • (LeetCode C++)盛最多水的容器
  • (安全基本功)磁盘MBR,分区表,活动分区,引导扇区。。。详解与区别
  • (编译到47%失败)to be deleted
  • (二)hibernate配置管理
  • (分享)自己整理的一些简单awk实用语句
  • (附源码)spring boot球鞋文化交流论坛 毕业设计 141436
  • (数据结构)顺序表的定义
  • (数位dp) 算法竞赛入门到进阶 书本题集
  • (转)socket Aio demo
  • (转)总结使用Unity 3D优化游戏运行性能的经验
  • (转载)深入super,看Python如何解决钻石继承难题
  • .htaccess 强制https 单独排除某个目录
  • .NET Core引入性能分析引导优化
  • .NET DataGridView数据绑定说明