為什么webpack-dev-server中在iframe模式下不能自動更新視圖

之前沒有嘗試使用webpack-dev-server，只是用webpack進行打包。但是通過一些資料了解到，在webpack-dev-server模式下，是可以自動進行debug的。

下面是我的webpack.config.js

let path = require('path');

module.exports = {
    entry: ['./App/app.js'],
    output: {
        path: path.join(__dirname, '/dest'),
        publicPath: '/dist/',
        filename: 'app.js'
    },
    resolve: {
        extensions: ['.js', '.jsx', '.css']
    },
    module: {
        loaders: [
            {   test: /\.js|jsx$/,
                loaders: ['babel-loader'],
                exclude: /node_modules/
            },
            {
                test: /\.css$/,
                loaders:['css-loader']
            },
            {   test: /\.(eot|woff|woff2|svg|ttf)([\?]?.*)$/,
                loaders: ['file-loader']
            },
            {   test: /\.json$/,
                loader: 'json-loader'
            }
        ]
    },
    devServer: {
        publicPath: '/dist/',
        hot:true
    }
};

接著我鍵入$webpack-dev-server訪問 http://localhost:8080/webpack-dev-server/index.html (iframe模式)，修改代碼后，視圖沒有發(fā)生更新。即使重新鍵入webpack-dev-server視圖也沒有發(fā)生任何改變。

只能通過十分繁瑣的方法改變視圖，先鍵入$webpack等它打包好后再鍵入$webpack-dev-server這樣才會發(fā)生視圖的更新。

我想請問一下是哪里出現(xiàn)了問題。