webpack-dev-server 热加载使用时报错

Question

我的webpack.config.js配置清单：

var webpack = require('webpack')
var WebpackBroserPlugin = require("webpack-browser-plugin")
var BomPlugin = require('webpack-utf8-bom');//将文件转成utf-8 bom格式，解决中文乱码的问题
var path = require('path')
module.exports = {
    entry:['./src/example5'],
    output: {
        path:path.join(__dirname,"./dist/js"),
        publicPath: '/dist/',
        filename:'bundle.js'
        // publicPath: '/'
    }, //页面引用的文件
    module: {
        loaders: [
            //http://react-china.org/t/webpack-extracttextplugin-autoprefixer/1922/4
            // https://github.com/b82/webpack-basic-starter/blob/master/webpack.config.js
            {test: /\.html$/, loader: 'raw!html-minify'},{
                test: /\.js$/,
                exclude: /node_modules/,
                loaders: ['es3ify']
            }
        ]
    },
    resolve: {
        extensions: ['.js', '']
    },
    plugins:[
        new WebpackBroserPlugin(),
        new BomPlugin(true),
        new webpack.HotModuleReplacementPlugin()
    ]
}

使用node配置热加载，server.js代码：

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

var config = require('./webpack.config.js');
config.entry.unshift("webpack-dev-server/client?http://localhost:8080/", "webpack/hot/dev-server");
var compiler = webpack(config);
var server = new WebpackDevServer(compiler, {
    publicPath: '/dist/',
    hot: true
});
server.listen(8080);

错误情况：
第一次启动时，正常启动，但是在修改了文件保存，node启动修改之后，就会报错，错误信息：

看错误信息是找不到文件，但是我在webpack.config.js设置了出口文件，不知道问题在哪？
而且我也同样的尝试了使用inline的方式实现自动刷新，也是同样的错误，找不到相关的bundle.js文件

Error: ENOENT: no such file or directory, open 'D:\bundle.js'

又遇到相同的问题的吗？纠结了两天，各种尝试，尝试了不同版本的webpack和webpack-dev-server 但还是同样的错误。

我的配置已经上传到github上了 目前还不能使用，大牛给看看 地址：
https://github.com/yangsirgo/...

Answer 1

从你提供的报错的图片信息:

    D:\avalon-obj\dist\js\0-xxxxxx.hot-update.js

这个文件是你每次修改文件后，webpack将这个文件进行编译后输入的chunk。既然报错没用找到这个文件，那么还是你的路径没有写对。

你试试修改下output里面的配置信息

    output: {
        path: path.join(__dirname, '/dist'),
        publicPath: '/dist/',
        filename: 'js/bundle.js'
    }

然后修改下你在index.html里面引入js的路径:

    <script src="/dist/js/bundle.js"></script>

Answer 2

bundle.js文件是存放在项目目录__dirname下面的/dist/js文件夹中, 不会指向D:\bundle.js的, 请检查指向有没有错误.

猜测可能实在index.html里面, 直接引用了bundle.js: <script src="bundle.js" />

Answer 3

这个已经很老的配置的。新的版本不要看这个了。看我的另外一个文档。
https://github.com/ganxunzou/...