React+WebpackSetup.md

1. npm init in the project folder

2. npm install webpack webpack-cli webpack-dev-server -g

3. npm install babel-loader @babel/core @babel/preset-env @babel/preset-react --save-dev

4. Create webpack.config.js in main folder:

   const path = require('path');
   
   module.exports = {
     entry: './index.js',
     output: {
       path: path.resolve(__dirname, 'dist'),
       filename: 'bundle.js'
     },
     module: {
       rules: [
         { 
   	  test: /\.jsx?$/, 
   	  exclude: /node_modules/,
   	  use: {
   	    loader: 'babel-loader',
   	    options: {
   	      presets: ['@babel/preset-env', '@babel/preset-react']
   	    }
   	  },
         },
       ]
     },
     mode: 'development'
   };
   

5. Take a break

6. index.html should have <script src='dist/bundle.js'></script> at the end of body

7. Install react and react-dom using npm install react react-dom prop-types --save-dev