{"componentChunkName":"component---src-templates-blog-js","path":"/blog/2015/06/12/deprecating-jstransform-and-react-tools.html","result":{"data":{"markdownRemark":{"html":"

Today we’re announcing the deprecation of react-tools and JSTransform.

\n

As many people have noticed already, React and React Native have both switched their respective build systems to make use of Babel. This replaced JSTransform, the source transformation tool that we wrote at Facebook. JSTransform has been really good for us over the past several years, however as the JavaScript language continues to evolve, the architecture we used has begun to show its age. We’ve faced maintenance issues and lagged behind implementing new language features. Last year, Babel (previously 6to5) exploded onto the scene, implementing new features at an amazing pace. Since then it has evolved a solid plugin API, and implemented some of our non-standard language features (JSX and Flow type annotations).

\n

react-tools has always been a very thin wrapper around JSTransform. It has served as a great tool for the community to get up and running, but at this point we’re ready to let it go. We won’t ship a new version for v0.14.

\n

Migrating to Babel

\n

Many people in the React and broader JavaScript community have already adopted Babel. It has integrations with a number of tools. Depending on your tool, you’ll want to read up on the instructions.

\n

We’ve been working with the Babel team as we started making use of it and we’re confident that it will be the right tool to use with React.

\n

Other Deprecations

\n

esprima-fb

\n

As a result of no longer maintaining JSTransform, we no longer have a need to maintain our Esprima fork (esprima-fb). The upstream Esprima and other esprima-based forks, like Espree, have been doing an excellent job of supporting new language features recently. If you have a need of an esprima-based parser, we encourage you to look into using one of those.

\n

Alternatively, if you need to parse JSX, take a look at acorn parser in combination with acorn-jsx plugin which is used inside of Babel and thus always supports the latest syntax.

\n

JSXTransformer

\n

JSXTransformer is another tool we built specifically for consuming JSX in the browser. It was always intended as a quick way to prototype code before setting up a build process. It would look for <script> tags with type="text/jsx" and then transform and run. This ran the same code that react-tools ran on the server. Babel ships with a nearly identical tool, which has already been integrated into JS Bin.

\n

We’ll be deprecating JSXTransformer, however the current version will still be available from various CDNs and Bower.

","excerpt":"Today we’re announcing the deprecation of react-tools and JSTransform. As many people have noticed already, React and React Native have both switched their respective build systems to make use of Babel. This replaced JSTransform, the source transformation tool that we wrote at Facebook. JSTransform has been really good for us over the past several years, however as the JavaScript language continues to evolve, the architecture we used has begun to show its age. We’ve faced maintenance issues and…","frontmatter":{"title":"Deprecating JSTransform and react-tools","next":null,"prev":null,"author":[{"frontmatter":{"name":"Paul O’Shannessy","url":"https://twitter.com/zpao"}}]},"fields":{"date":"June 12, 2015","path":"content/blog/2015-06-12-deprecating-jstransform-and-react-tools.md","slug":"/blog/2015/06/12/deprecating-jstransform-and-react-tools.html"}},"allMarkdownRemark":{"edges":[{"node":{"frontmatter":{"title":"Introducing the New JSX Transform"},"fields":{"slug":"/blog/2020/09/22/introducing-the-new-jsx-transform.html"}}},{"node":{"frontmatter":{"title":"React v17.0 Release Candidate: No New Features"},"fields":{"slug":"/blog/2020/08/10/react-v17-rc.html"}}},{"node":{"frontmatter":{"title":"React v16.13.0"},"fields":{"slug":"/blog/2020/02/26/react-v16.13.0.html"}}},{"node":{"frontmatter":{"title":"Building Great User Experiences with Concurrent Mode and Suspense"},"fields":{"slug":"/blog/2019/11/06/building-great-user-experiences-with-concurrent-mode-and-suspense.html"}}},{"node":{"frontmatter":{"title":"Preparing for the Future with React Prereleases"},"fields":{"slug":"/blog/2019/10/22/react-release-channels.html"}}},{"node":{"frontmatter":{"title":"Introducing the New React DevTools"},"fields":{"slug":"/blog/2019/08/15/new-react-devtools.html"}}},{"node":{"frontmatter":{"title":"React v16.9.0 and the Roadmap Update"},"fields":{"slug":"/blog/2019/08/08/react-v16.9.0.html"}}},{"node":{"frontmatter":{"title":"Is React Translated Yet? ¡Sí! Sim! はい！"},"fields":{"slug":"/blog/2019/02/23/is-react-translated-yet.html"}}},{"node":{"frontmatter":{"title":"React v16.8: The One With Hooks"},"fields":{"slug":"/blog/2019/02/06/react-v16.8.0.html"}}},{"node":{"frontmatter":{"title":"React v16.7: No, This Is Not the One With Hooks"},"fields":{"slug":"/blog/2018/12/19/react-v-16-7.html"}}}]}},"pageContext":{"slug":"/blog/2015/06/12/deprecating-jstransform-and-react-tools.html"}},"staticQueryHashes":[]}