Setting up webpack to handle es6, react & scs

Webpack is quite powerful when it comes to building out your node projects on the fly. There are a few other choices, but more on that later. Webpack has 4 building blocks when it comes to it’S “webpack.config.js” file. There is the only Entry point, Output, Module & Plugins. The entry point is the main file where you will be importing various modules and stylesheets. The output is where you state the directory for the bundled javascript file. Modules accepts an array called “rules”. This is where you can use certain loaders for sass, es6 (babel), images etc.. Then at the end are plugins. This is where you can uglify your Javascript, extract your CSS into files and much more. At the end of the day, all your files will be running through Webpack. Giving you super powers, instead of writing old css and js.