webpack怎么配置才可以监测并自动刷新由angular路由引入的页面？

Question

angular1.5配合webpack使用，webpack要怎么配置才可以监听并自动刷新由angular-ui-router里的templateUrl引入的html页面？

路由JS：

angular.module('mainApp', [
        'ui.router',
        'angularLoad',
        'Hello',
        'Name',
        'rangeValidator',
        'matchValidator',
        'name.component',
        'ballApp'
    ])
    .config(function($stateProvider, $urlRouterProvider) {
        // $urlRouterProvider.otherwise('/all');
        $stateProvider
            .state('all', {
                url: '/all',
                template: '<div ui-view></div>',

            })
            .state('all.demo1', {
                url: '/demo1',
                templateUrl: 'public/views/demo1.html',
                controller: function($scope, $location, $http) {
                    $scope.skip = function() {
                        $location.path('/demo2');
                    };
                    $scope.getInfo = function() {
                        $http.get('/api/query?name=abby&age=20').then(res => {
                            console.log(res);
                        });
                    };
                }
            })
            .state('all.demo2', {
                url: '/demo2',
                templateUrl: 'public/views/demo2.html',
                controller: function($scope, $timeout) {
                    $scope.number = () => 0;
                    $timeout(() => $scope.number = () => 100, 2000);
                    $scope.num = 0;
                    $scope.getCount = function() {
                        $scope.num += 1;
                    };
                },

            })
            .state('all.demo3', {
                url: '/demo3',
                templateUrl: 'public/views/demo3.html',
                controller: function($scope, $filter) {
                    var shadow = document.querySelector('#nameComponent').createShadowRoot();
                    var template = document.querySelector('#nameComponentTemplate');
                    shadow.appendChild(template.content);
                    console.log(template.content);
                    template.remove();
                    document.querySelector('#nameComponent').textContent = '陆凌牛';

                    $scope.users = [
                        { name: 'abby', age: 20 },
                        { name: 'lili', age: 20 },
                        { name: 'jame', age: 22 },
                        { name: 'jane', age: 19 }
                    ];
                    $scope.filter = $filter('filter')($scope.users, { age: 19 })[0].name;
                    $scope.obj = {
                        name: 'abby',
                        id: '1223fssdkrh37',
                        sex: 'female'
                    };
                    $scope.getData = function() {
                        return JSON.stringify($scope.obj);
                    }
                }
            })
            .state('all.ball', {
                url: '/ball',
                templateUrl: 'public/views/ball.html',
                controller: 'ballCtrl'
            })
            .state('all.arrow', {
                url: '/arrow',
                templateUrl: 'public/views/arrow.html',
            })
    })
    .filter('turnToArray', function() {
        return function(input) {
            var output = +input;
            if (isNaN(output)) {
                return input;
            } else {
                console.log('else');
                return output;
            }
        }
    })
    .run(function(angularLoad){
        angularLoad.loadCSS('./node_modules/bootstrap/dist/css/bootstrap.css');
        angularLoad.loadCSS('./public/css/index.css');
        angularLoad.loadCSS('./public/css/ball-pulse.css');
    })
    .controller('mainCtrl', function($scope, $state, $location, $window, $log) {
      ....
    })

webpack配置：

const path = require('path');
const webpack = require('webpack');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ProvidePlugin = require('webpack/lib/ProvidePlugin');
const CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin');
const HotModuleReplacementPlugin = require('webpack/lib/HotModuleReplacementPlugin');
const glob = require('glob');
const matchesFiles = new glob.Glob('./public/js/*.js',{sync:true}).found; // match all files in the specified directory

module.exports = {
    entry: {
        app: matchesFiles,
        vendor: [
            './public/vendor/jquery-3.1.0.js',
            './node_modules/angular/angular.js',
            './node_modules/angular-resource/angular-resource.js',
            './node_modules/angular-ui-router/release/angular-ui-router.js',
            './node_modules/ngstorage/ngStorage.js',
            './node_modules/lodash/lodash.js',
            './node_modules/angular-load/angular-load.js',
        ]
    },
    devtool: 'cheap-module-source-map',
    debug: true,
    module: {
        loaders: [{
            test: /\.css$/,
            loaders: ['to-string-loader','style-loader', 'css-loader']
        }, {
            test: /\.html$/,
            loader: 'raw-loader'
        }, {
            test: /\.js$/,
            loader: 'script-loader',
            exclude: ['./node_modules/**/*.js']
        }, {
            test: require.resolve("jquery"),
            loader: "imports?jQuery=jquery,$=jquery,this=>window,require=>false"
        }]
    },
    plugins: [
        new CommonsChunkPlugin('vendor', 'vendor.js'),
        // new CopyWebpackPlugin([{
        //     from: './public',
        //     to: 'assets'
        // }]),
        new HtmlWebpackPlugin({
            template: './public/views/index.html',
            chunksSortMode: 'dependency',
            inject: 'body'
        }),
        new webpack.ProvidePlugin({
            jQuery: 'jquery',
            $: 'jquery'
        }),
        new HotModuleReplacementPlugin()
    ],
    resolve: {
        extensions: ['', '.js', '.json', '.css'],
        alias: {
            jquery: 'jquery/src/jquery'
        }
    },
    devServer: {
        port: 5001,
        host: 'localhost',
        // hot: true,
        historyApiFallback: true,
        watchOptions: {
            aggregateTimeout: 300,
            poll: 1000
        },
        outputPath: '/',
        proxy: {
            '/api/*': {
                target: 'http://localhost:8000',
                secure: false,
            }
        }
    },
    node: {
        global: true,
        crypto: 'empty',
        process: true,
        module: false,
        clearImmediate: false,
        setImmediate: false
    }
}