Use .js
for JavaScript file extensions. Avoid using .jsx
.
Here are a few reasons to avoid the .jsx
file extension:
Not recommended by the React team — The React themselves doesn't recommend the .jsx
extension. The official create-react-app
only later started supporting it in 2016 (v0.4.1).
Lack of support — Webpack, Node.js, and browsers do not support the .jsx
file extension by default. It's possible to configure Webpack to support .jsx
files, but this is more of an "aftermarket" tweak than a typical use case.
Developer friction — If you were to add a line of JSX into a .js
file, you'd need to rename it to .jsx
. This hurts the ergonomics of the developer experience, as noted by Dan Abramov in this comment.
See these online discussions on the issue: