babel react webpack build

babel react webpack build

#package.json
{
  "dependencies": {
    "@babel/core": "^7.2.2",
    "@babel/preset-env": "^7.3.1",
    "@babel/preset-react": "^7.0.0",
    "autoprefixer": "^9.4.6",
    "babel-loader": "^8.0.5",
    "css-loader": "^2.1.0",
    "mini-css-extract-plugin": "^0.5.0",
    "node-sass": "^4.11.0",
    "postcss-loader": "^3.0.0",
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-router": "^4.3.1",
    "sass-loader": "^7.1.0",
    "webpack": "^4.29.0",
    "webpack-cli": "^3.2.1"
  },
  "scripts": {
    "c": "webpack",
    "w": "webpack -w"
  },
  "devDependencies": {},
  "babel": {
    "presets": [
      "@babel/env",
      "@babel/react"
    ]
  }
}

# webpack.config.js
const path = require('path'),
    MiniCssExtractPlugin = require("mini-css-extract-plugin");

module.exports = {
    mode: "development",
    entry: [
        './assets/js/app.jsx',
        './assets/sass/main.scss',
    ],
    output: {
        path: path.resolve(__dirname, 'public/js'),
        filename: 'bundle.js',
        publicPath: '/'
    },
    module: {
        rules: [
            {
                test: /\.jsx?$/,
                use: 'babel-loader',
            },
            {
                test: /\.(scss|css)$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    {
                        loader: "css-loader",
                        options: {
                            minimize: {
                                safe: true
                            }
                        }
                    },
                    {
                        loader: "postcss-loader",
                        options: {
                            autoprefixer: {
                                browsers: ["last 2 versions"]
                            },
                        },
                    },
                    {
                        loader: "sass-loader",
                        options: {}
                    }
                ],
            }
        ],
    },
    plugins: [
        new MiniCssExtractPlugin({
            filename: "[name].bundle.css",
            chunkFilename: "[id].css"
        })
    ],
};