React Setup, Part II: Babel
Babel can also do many other powerful things. It’s worth exploring outside of the context of this course!
Babel‘s npm module’s name is
babel-core. You’re going to install
babel-core slightly differently than you installed
react-dom. Instead of
npm install --save babel-core, you will use the command
npm install --save-dev babel-core.
This is because you will only be using
Babel in development mode. When a React app is shipped into production, it no longer needs to make transformations: the transformations will be hard-coded in place. The
--save-dev flag saves an npm module for development version only.
--save can be shortened to
--save-dev can be shortened to
You’re also going to install two other babel-related modules, named
babel-preset-react, respectively. We’ll explain those soon!
Use one of these terminal commands to install
In order to make Babel work, you need to write a babel configuration file.
In your root directory, create a new file named .babelrc. If you get prompted about starting a filename with a period, go ahead and say that it’s okay.
Save the following code inside of .babelrc:
That’s it! Babel is now ready to go.
Whenever you’re ready, continue to our next article!