Sublime React JSX Format plugin configuration

The plug-in name is:

SUBLIME jsfmt.

The GitHub address is:

Https://github.com/royriojas/esformatter-jsx/wiki/Usage-with-jsfmt

Set Setting User:

//Add to your{  "AutoFormat":true,  "Extensions": [    "JS",    "Jsx",    "Sublime-settings"  ],  "Options": {    "Plugins": [      "Esformatter-jsx",    ],    "Jsx": {      "FORMATJSX":true,      //Change These to your preferred values      //refer to Https://github.com/royriojas/esformatter-jsx#best-configuration for more options"Attrsonsamelineastag":false,      "Maxattrsontag": 1,      "Firstattributeonsameline":false,      "Alignwithfirstattribute":true,      "Formatjsxexpressions":true    }  //Other esformatter options  }}

The default setting is that the component's properties, if wrapped, are indented to the component length and are not aesthetically pleasing, as follows:

Modify ~\appdata\roaming\sublime Text 3\packages\jsfmt\node_modules\jsfmt\lib\format.js

The original code

var alignwith = Me.jsxOptions.alignWithFirstAttribute? First.loc.start.column:node.loc.start.column + indentsize;

Revision changed to

var attrlen = first.parent.name.name.length; var alignwith = Me.jsxOptions.alignWithFirstAttribute? (First.loc.start.column-attrlen): Node.loc.start.column-attrlen + indentsize;

Sublime React JSX Format plugin configuration