Sublime Forum

Improve JSX syntax formatting - React fragments short syntax

#1

See https://reactjs.org/docs/fragments.html#short-syntax

class Columns extends React.Component {
  render() {
    return (
      <>
        <td>Hello</td>
        <td>World</td>
      </>
    );
  }
}

Thanks <3

0 Likes

#2

Sublime Merge comes with the same default syntax definition packages as Sublime Text 3. They provide only pure JavaScript, HTML and PHP support.

Custom template languages such as jinja2 or extensions like JSX are not supported out of the box.

Solution 1

If you have Sublime Text 3 installed (no portable setup), Sublime Merge should be able to pick up all 3rd-party packages from it. Hence installing JS Custom package in ST3 and setting it up to support React would enable Sublime Merge to display this syntax correctly as well.

On Windows SM looks for ST packages in %appdata%\Sublime Text 3\Installed Packages and %appdata%\Sublime Text 3\Packages for instance.

Solution 2

If you don’t have Sublime Text installed, you’d need to install packages with custom syntax definitions manually. The (data/package) directory structure of SM is the same as for ST.

see: https://www.sublimemerge.com/docs/packages

0 Likes