Why does React require Babel and Webpack to work?


I was looking at the wiki page of vue.js and saw this:

When compared to React development, Vue can be integrated to an existing web application much more easily. Normally, a web application can start using Vue immediately by simply including the Vue.js JavaScript library. Usage with Webpack or Browserify, are not strictly necessarily. This is in stark contrast to React development where Usage with Webpack and Babel is unavoidable, therefore making converting existing web application much more difficult.

Can someone explain why React needs webpack and babel? I thought you can just drop in the link to the CDN of React and it will work?

No, Babel and Webpack is not necessary for React stack. You can still find other alternatives to build your favourite stack such as Browserify and Gulp.

However, if you want to make things easier, I do recommend you learn and use Babel and Webpack together with React because:

  • You can use modules.
  • You can use JSX with ES6.
  • It support a lot of browsers
  • You can use more advanced features (async/await) etc

With webpack

  • You can use different loaders for sass, less, postcss etc
  • You can use different plugins to optimise your build such as Uglify, HotModuleReplacement, Chunks etc

There are many more advantages to use webpack which you can find here