How to configure atom-beautify package to format with babel/jsx javascript files?

reactjs atom-editor babeljs prettify
Damien Leroux picture Damien Leroux · May 14, 2016 · Viewed 16.1k times · Source

I searched for a package to auto-indent and beautify my React/babel code. I just tried atom-beautify which seems to have good feeback on Atom.

But the result on an usual babel file is not good enough: "HTML tag" doesn't indent as wanted. Has anyone tried to use atom-beautify with babel?

Answer

David Meents picture David Meents · May 15, 2016

I currently use the plugins language-babel, react, and autoclose-html to handle this for me with no issues.

https://atom.io/packages/autoclose-html

https://atom.io/packages/language-babel

https://atom.io/packages/react

Hope this helps!

Related questions

How to config ESLint for React on Atom Editor

In Atom Editor I installed the following plugins linter linter-eslint It seems they don't recognize the JSX syntaxis. I have it working on the command line but had to use other plugins like esprima-fb and eslint-plugin-react. Looks like there are …

Read More
Can you force a React component to rerender without calling setState?

I have an external (to the component), observable object that I want to listen for changes on. When the object is updated it emits change events, and then I want to rerender the component when any change is detected. With …

Read More
Loop inside React JSX

I'm trying to do something like the following in React JSX (where ObjectRow is a separate component): <tbody> for (var i=0; i < numrows; i++) { <ObjectRow/> } </tbody> I realize and understand why this isn't …

Read More