O'Reilly logo

React 16 Tooling by Adam Boduch

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Loading and compiling files

Loading and compiling files for your bundle are probably the most important capabilities of Webpack. Interestingly, Webpack doesn't directly process your files once they're loaded. Instead, it coordinates I/O as it passes through Webpack loader plugins. For example, the Webpack configuration used by react-scripts uses the following loader plugins:

  • Babel: The Babel loader transpiles the JavaScript in your application's source files into JavaScript that all browsers will understand. Babel will also take care of compiling your JSX syntax into regular JavaScript.
  • CSS: There are a couple loaders used by react-scripts that result in CSS output:
    • style-loader: Import CSS modules like JavaScript modules using the import ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required