1. {
    2.   "name": "smash-template-react-v16",
    3.   "version": "1.0.0",
    4.   "description": "",
    5.   "main": "index.js",
    6.   "scripts": {
    7.     "test": "echo \"Error: no test specified\" && exit 1",
    8.     "dev": "webpack-dev-server --mode development",
    9.     "build": "webpack --mode production"
    10.   },
    11.   "author": "",
    12.   "license": "ISC",
    13.   "dependencies": {
    14.     "react": "^16.7.0",
    15.     "react-dom": "^16.7.0"
    16.   },
    17.   "devDependencies": {
    18.     "@babel/core": "^7.2.2",
    19.     "@babel/preset-env": "^7.2.3",
    20.     "@babel/preset-react": "^7.0.0",
    21.     "babel-loader": "^8.0.5",
    22.     "html-loader": "^0.5.5",
    23.     "html-webpack-plugin": "^3.2.0",
    24.     "uglifyjs-webpack-plugin": "^2.1.1",
    25.     "webpack": "^4.28.4",
    26.     "webpack-cli": "^3.2.1",
    27.     "webpack-dev-server": "^3.1.14"
    28.   }
    29. }
    1. const path = require('path');
    2. const HtmlWebPackPlugin = require("html-webpack-plugin");
    4. module.exports = {
    5.   entry: {
    6.     index: './src/index.js',
    7.   },
    8.   output: {
    9.     path: path.join(__dirname, 'dist'),
    10.     filename: '[name].[hash].js',
    11.   },
    12.   module: {
    13.     rules: [
    14.       { test: /\.js$/, exclude: /node_modules/, loader: "babel-loader" },
    15.       { test: /\.html$/, use: [{ loader: "html-loader" }] },
    16.     ]
    17.   },
    18.   plugins: [
    19.     new HtmlWebPackPlugin({
    20.       template: "./src/index.html",
    21.       filename: "index.html",
    22.     }),
    23.   ],
    24.   devServer: {
    25.     contentBase: path.join(__dirname, 'dist'),
    26.     compress: true,
    27.     open: true,
    28.   },
    29.   externals: {
    30.     jquery: 'jQuery',
    31.     react: 'React',
    32.     'react-dom': 'ReactDOM',
    33.   },
    34.   resolve: {
    35.     alias: {
    37.     },
    38.   },
    39. };