Hacker News Reader

Comment by Raphael | Hacker News Reader

Is there a reason the files are ".js" rather than ".jsx"?

As it stands, my text editor defaults to the JS syntax highlighting. I suppose one could make JSX their default JS syntax, but then JSX would incorrectly appear to be correct in non-React files.

View on HN

Some developers (including FB) are using .js for React JSX files now, instead of the .jsx extension. I think the best argument for this is that, while JSX features aren't in the ES2016/7 spec, they may be eventually. And when you're transpiling your code to JS in the end anyway (potentially using JSX, Flow, and other tools that aren't actually valid ES2016/7 code), it's simpler to call it .js than think about renaming files when you add more steps to your babel process (file.flow.jsx.xyz...).

It hasn't taken off completely, and personally I like having the ".jsx" extension indicate that file will export a React component instead of plain javascript.

There are lots of arguments online about this: https://github.com/facebook/react/issues/3582#issuecomment-8... https://www.reddit.com/r/reactjs/comments/4kkrwg/ask_js_or_j...

I don't think many have embraced the .jsx extension.

And arguably it doesn't make a lot of sense, because when working with most modern frameworks/libs, JSX is not the only non-standard-js element in the file. Should we call it .es6, .es2015, .es2015+jsx ?

So yeah, sticking with .js is common.

ES2015 is standard JS. Maybe not widely deployed, but it's standard.

JSX is not.

If your editor is Visual Studio Code:

    Preferences > Workspace Settings (to target your React project) >

    {
      "files.associations": {
        "*.js": "javascriptreact"
      }
    }

I remember I started out using `.jsx`, but switch to `.js` solely because I could use `require()` without specifying the extension, WITHOUT modifying the module resolution algorithm.

Reply on news.ycombinator.com