react jsx 代码格式化

Posted 2020-09-19 龙鸿轩

使用说明:

jsx内部的代码先用Ctrl+q格式化一遍,再Ctrl+S保存

或者也可以将Sublime JSFMT设置为 "autoformat": true, 则每次保存会有一两秒卡顿.

插件1

JsFormat : Settings - User

{
  "e4x": true,
  // jsformat options
  "format_on_save": true,
  // {}大括号不再强制换行
  "brace_style": "collapse-preserve-inline",
  "format_selection": false,

   "indent_size": 2,
   "indent_char": " ",
   "indent_with_tabs": false,
}

 

插件2

Sublime JSFMT : Settings - User

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

Key Bindings - User

{ "keys": ["ctrl+q"], "command": "format_javascript" }

 

如有其他问题可参考 https://github.com/royriojas/esformatter-jsx/wiki/Usage-with-jsfmt