使用vuejs和webpack-dev-server,浏览器无法自动刷新

Question

之前用react的时候，浏览器是能够正常自动刷新的，现在用vue发现，修改vue浏览器不能自动刷新。

main.js:

import Vue from 'vue';
var myComponent = Vue.extend({
  template:"<div>hello vue template</div>"
});
Vue.component('my-component',myComponent);
var vm = new Vue({
  el: '#app'
});

index.html:

<div id="app">
      <my-component></my-component>
</div>

webpack配置:

const webpack = require('webpack');
module.exports = {
        entry:['webpack-dev-server/client?http://localhost:8080',
    'webpack/hot/only-dev-server','./src/vue/main.js'],
        output:{
            path: __dirname + '/dist/js',
            filename:'vue.bundle.js',
            publicPath:'/public'
        },
        module:{
            loaders:[
                {
                    test:/\.jsx?$/,
                    exclude:/node_modules/,
                    loaders:["babel"]
                },
                {
                    test: /\.vue$/,
                    loader: 'vue'
                },
                {
                    test:/\.css$/,
                    loader:'style!css'
                },
                {
                    test: /\.scss$/,
                    loader: 'style!css!sass'
                },
                {
                    test:/\.(jpg|png)$/,
                    loader:'url'
                }
            ]
        },
        resolve: {
            root: [process.cwd() + '/src', process.cwd() + '/node_modules'],
            alias: {},
            extensions: ['', '.js', '.vue','.css', '.scss', '.ejs', '.png', '.jpg']
        },
        plugins: [
            new webpack.HotModuleReplacementPlugin(),
            new webpack.NoErrorsPlugin(),
            new webpack.BannerPlugin('This file is created by laoqiren')
        ]
};

server.js:

var webpack = require('webpack');
var WebpackDevServer = require('webpack-dev-server');
var config = require('./webpack.config');

new WebpackDevServer(webpack(config), {
  publicPath: config.output.publicPath,
  hot: true,
  inline: true,
  stats:{colors:true},
  historyApiFallback: true
}).listen(8080, 'localhost', function (err, result) {
  if (err) console.log(err);
  console.log('Listening at localhost:8080');
});

请问这是怎么回事呢？修改vue代码必须要手动刷新才行。。。

Answer 1

webpack.config 里面 hot改为false