sublime 格式化react插件配置教程 jsfmt配置

1.下载如下插件:

https://github.com/ionutvmi/sublime-jsfmt#installation

这个插件是jsfmt,可以直接在package里搜索到;

2.user setting里放入如下配置:

{
    "autoformat": true,
    "extensions":
    [
        "js",
        "jsx",
        "sublime-settings"
    ],
    "options":
    {
        "jsx":
        {
            "alignWithFirstAttribute": true,
            "attrsOnSameLineAsTag": false,
            "firstAttributeOnSameLine": false,
            "formatJSX": true,
            "maxAttrsOnTag": 1
        },
        "plugins":
        [
            "esformatter-jsx"
        ]
    }
}

3.打开package文件:

如上,jsfmt中安装npm插件:

npm i [email protected] [email protected]

这个插件可以实现jsx的代码格式化,如果不安装,不能正常格式化jsx,只能格式化js

4.最后设置快捷键:

如图,这个在github中有教程,只要是本身插件没设置快捷键,如要本人自己设置快捷键

时间: 2024-10-10 07:37:01

sublime 格式化react插件配置教程 jsfmt配置的相关文章

前端开发 sublime text 常用插件和配置

前端开发sublimeconfig mac配置 此文件目录中文件主要是关于sublime的插件配置,快捷键配置,主题和字体配置. 插件列表 所有插件都可以使用Package Control安装,具体的安装方法可以自行谷歌安装,不在本文的介绍范围之内.也可以是使用git 手动安装. 1.autoprefixer 该插件主要使编写css更加的方便和快捷,可以配置快捷键给标签属性添加浏览器厂商前缀.安装前需要确定电脑安装node. 配置快捷键如下: //autoprefixer快捷键设置 { "key

phpstorm通过FileWatchers配置自动格式化代码插件

在自动格式代码的插件中, prettier一直是挺不错的, 这个插件在不同的IDE里有不同的配置地方, 但是配置参数基本上是差不多的. 下面就说明下在phpstorm(版本2019.2)中如何配置的吧. 我的环境: mac os x 10.14.4 1. 安装prettier插件, 最好是全局安装 1.1 通过: brew install prettier      (这种方式有可能会升级本机中的node, 因为prettier依赖于node, 所以环境会有较大变化) 1.2 通过: npm i

手把手教你webpack、react和node.js环境配置(上篇)

很多人刚学习react的时候,往往因为繁琐的配置而头疼,这里我将手把手教大家怎么用webpack配置react和redux的环境,这篇教程包括前端react和后台node整个网站的环境配置,对node没兴趣的可以只看这篇. 这里是下篇链接:手把手教你webpack.react和node.js环境配置(下篇) 我把所有代码都放到了github上面供参考:webpack-react-express环境配置 1. 什么是webpack? Webpack 是当下最热门的前端资源模块化管理和打包工具.它可

sublime格式化插件---HTML-CSS-JS Prettify美化代码

1.HTML-CSS-JS Prettify HTML-CSSS-JS Prettify插件使用js-beautify来格式化js.html与css代码.可以在这里尝试js-beautify的效果原始代码: // This is just a sample script. Paste your real code (javascript or HTML) here. if ('this_is'==/an_example/){of_beautifier();}else{var a=b?(c%d):

Cocos2d-x 3.x 全平台新手开发配置教程

本文为Cocos2d-x 3.x 全平台(Android,iOS)新手开发配置教程攻略,希望对大家有所帮助.因为这篇文章是面对新手的.所以有些地方会啰嗦一些,请勿见怪.如果教程中有错误,欢迎指正.如果在配置开发平台时还遇到问题,欢迎大家讨论. 本文所使用的环境是PC(Win7),HTC G18,MacBook Air 以及 Mini iPad. 一.通用准备工作 1.安装Cocos2d-x 3.1 在Cocos2d官网上下载Cocos2d-x 3.1引擎,下载后解压缩. 2.安装Eclipse与

腾讯云服务器centos 6.5(jdk+tomcat+vsftp)、腾讯mysql数据库 及 tomcat自启动 配置教程

1.腾讯云数据库配置 1.考虑到安全性问题,,平常不使用root用户登录,新增一个用户名neil,用来管理项目的数据库 a.首先登录root创建db_AA数据库 b.在root用户下,创建neil用户,并对neil用户授权对db_AA数据库所有操作. GRANT ALL ON db_AA.* TO [email protected]"%" IDENTIFIED BY "XXXX"; 2.将现有数据导入到数据库中 注意:尽量不要使用Myeclipse.Navicat等

Nessus漏洞扫描教程之配置Nessus

Nessus漏洞扫描教程之配置Nessus 配置Nessus 当安装成功Nessus工具后.就可以使用该工具实施漏洞扫描.为了使用户更好的使用该工具,将介绍一下该工具的相关设置.如服务的启动.软件更新.用户管理等.本节将对Nessus服务配置进行简介. 启动Nessus服务 Nessus服务安装后.默认是自己主动启动的.假设用户重新启动系统,获取进行其他操作时.将Nessus服务关闭的话.则再次訪问必需要先启动该服务. 以下将分别介绍在不同操作系统中,启动Nessus服务的方法. 1.Windo

Sublime Text3 快捷键汇总及设置快捷键配置环境变量

@Sublime Text3 快捷键汇总及设置快捷键配置环境变量 注册码如下: —– BEGIN LICENSE —– Andrew Weber Single User License EA7E-855605 813A03DD 5E4AD9E6 6C0EEB94 BC99798F 942194A6 02396E98 E62C9979 4BB979FE 91424C9D A45400BF F6747D88 2FB88078 90F5CC94 1CDC92DC 8457107A F151657B 1

微信公众号开发教程[002]-配置

一.注册微信公众号 微信公众号官方入口https://mp.weixin.qq.com注册公众号,注册过程中,类型选择可能是新手比较迷惑的地方.微信公众号分为订阅号和服务号(还有个企业号,似乎用的人不多),每种类型下面又分为公司,政府部门,社会组织,个人等不同性质.不同类型,不同性质的公众号,权限不同,申请资料也不同. 例如:公司(订阅号或服务号),你得提供工商注册号,银行对账号.注册成功后,也并不是所有权限都默认开通,需要手动开通.有些权限还得微信认证之后才能开通.关于这些细节,可参阅微信公众