webpack 启服务报错， 打包 js， html

参考：
https://segmentfault.com/a/1190000006178770

打包命令行：

webpack 或者 npm run start

启服务命令行：

npm run server

package.json:

{
    "name": "es6primary",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1",
        "start": "webpack",
        "server": "webpack-dev-server --open"
    },
    "author": "",
    "license": "ISC",
    "devDependencies": {
        "babel": "^6.23.0",
        "babel-core": "^6.26.3",
        "babel-loader": "^7.1.4",
        "babel-preset-env": "^1.7.0",
        "css-loader": "^0.28.11",
        "html-webpack-plugin": "^3.2.0",
        "style-loader": "^0.21.0",
        "webpack": "^4.8.3",
        "webpack-dev-server": "^3.1.4"
    }
}

webpack.config.js:

var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var path = require('path');

module.exports = {
    devtool: 'eval-source-map', // 将打包后的文件与源文件对应，以查找问题
    mode: 'development', // 防止  webpack-dev-server 报错
    entry: __dirname + '/code/js/index.js',
    output: {
        path: path.resolve(__dirname, './build'),
        filename: 'main.js'
    },
    devServer: { //本地服务启动文件
        contentBase: './dist',
        historyApiFallback: true,
        inline: true //实时刷新
    },
    module: {
        rules: [{
            test: /\.js$/,
            use: {
                loader: 'babel-loader'
            },
            exclude: /node_modules/
        }, {
            test: /.css$/,
            use: [{
                loader: 'style-loader'
            }, {
                loader: 'css-loader',
                options: {
                    modules: true
                }
            }]
        }]
    },
    //插件
    plugins: [
        new webpack.BannerPlugin('版权所有，翻版必究'),
        new HtmlWebpackPlugin({
            template: __dirname + '/dist/index.html' //需要打包的 html 文件
        })
    ]
}

webpack.config.js 添加生成环境启动

mode: ‘development’,