Minimal React build environment

Minimal React build environment

I've wasted a lot of time with Javascript build environments. I spend a lot of time trying to optimize my development environment in general. A lot of my projects use React for the fronted. This post is mainly for my reference to kick start a react project.

Things I'm looking from my tool/toolchain:

  1. Transpiling ES6 and React to Javascript.
  2. Bundle all the component codes into a single bundle.js
  3. Have a "watch" mode to watch for edits on files
  4. SPEED! There's nothing worse than painfully slow builds!

There is a whole array of posts and boilerplates available on Github. But most of them just have too many bells and whistles! I for one am not a big fan of hot-loading as I've had lots of troubles incorporating it with my existing projects.

Anyways this the setup I have right now. I use webpack to do the 4 things. This is the barebones webpack.config.js

Modify the "entry" to the entry point of your code.

.babelrc

This takes care of (1) and (2)

Use  webpack --watch

to take care of (3) and (4)

About Ganesh

Leave a Reply

Your email address will not be published. Required fields are marked *