webpack autobuild / auto serve应用程序

Question

我正在使用here

中的这个webpack项目模板

运行它我使用npm run serve。如何在更改文件时添加自动构建/服务。是与webpack还是npm有关？我是这个javascript工具的新手在谷歌搜索提供了许多超载信息和选项的选项。配置各不相同。

附加webpack配置：

    const path = require('path')
    const webpack = require('webpack')

    module.exports = env => {
        return {
            entry: {
                main: './src/index.js'
            },
            output: {
                filename: 'bundle.js',
                path: path.join(__dirname, 'dist'),
                publicPath: "/"
            },
            mode: env && env.production ? 'production' : 'development',
            module: {
                rules: [
                    {
                        test: /\.js$/,
                        exclude: /node_modules/,
                        use: {
                            loader: 'babel-loader',
                            options: {
                                presets: ['env']
                            }
                        }
                    },
                    {
                        test: [/\.vert$/, /\.frag$/],
                        use: 'raw-loader'
                    }
                ]
            },
            devServer

: {
            contentBase: './dist'
        },
        plugins: [
            new webpack.DefinePlugin({
                'CANVAS_RENDERER': JSON.stringify(true),
                'WEBGL_RENDERER': JSON.stringify(true)
            })
        ]
    }
}

我的package.json文件：

{
  "name": "phaser3-webpack",
  "version": "1.0.0",
  "description": "A basic Phaser 3 starter project",
  "main": "index.js",
  "scripts": {
    "build": "webpack",
    "build:production": "webpack --env.production",
    "clean": "rimraf dist/bundle.js",
    "watch": "webpack --watch",
    "serve": "webpack-dev-server"
  },
  "keywords": [
    "phaser",
    "webpack",
    "es6"
  ],
  "author": "John Cheesman",
  "license": "MIT",
  "dependencies": {
    "phaser": "^3.1.2"
  },
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.1",
    "raw-loader": "^0.5.1",
    "rimraf": "^2.6.1",
    "webpack": "^4.0.1",
    "webpack-cli": "^2.0.9",
    "webpack-dev-server": "^3.0.0"
  }
}