Note |
---|
Start with the matrix here as it provides a lot of information about configuring your editor: Editors/IDEs |
The ES2015 specification is fairly recent (2015), so some editors don't yet have built-in support for its syntax. Similarly, JSX (React) syntax, like all other templating languages (underscore, mako, django, etc) is generally not natively supported. Fortunately, many well-supported plugins are available to help bridge these gaps.
...
Editor | ES2015 | How? | JSX | How? |
---|---|---|---|---|
Sublime | Plugin | https://github.com/babel/babel-sublime | Plugin | babel-sublime also provides JSX support. |
PyCharm | Native | Set to ECMAScript 6+ by default in PyCharm. Can be modified by setting Preferences>Languages & Frameworks > Javascript to ECMAScript 6+, ECMAScript 5.1, or Flow .editorconfig files can be used to distinguish between ES5 and ES6 code. Perhaps a PyCharm user can provide further implementation details. | Plugin | https://www.jetbrains.com/help/pycharm/2017.1/using-reactjs-in-javascript-and-typescript.html |
Visual Studio Code (vscode) | Native | add | Native | But there's plenty of plug-ins and snippet tools if you want richer support. VS Code will prompt you to install extensions if it thinks you need them. |
Atom | Native | Plugin | https://orktes.github.io/atom-react/ | |
vim | Plugin | https://github.com/pangloss/vim-javascript | Plugin | https://github.com/mxw/vim-jsx |
Linting
vim
Install https://github.com/vim-syntastic/syntastic follow README instructions, then add this to your .vimrc:
Code Block |
---|
let g:syntastic_javascript_checkers=['eslint'] |
Also, install: https://github.com/mtscout6/syntastic-local-eslint.vim so that it lints based on each individual project's configuration.
You can also use https://github.com/sbdchd/neoformat to run an auto-formatter like prettier or prettier-eslint.See Vim Linting
Sublime
Install SublimeLinter and SublimeLinter-eslint via package control.
...