首页 > webpack-hot-middleware热加载问题

webpack-hot-middleware热加载问题

编译的时候打出的日志:

node代码:

var webpack = require('webpack');
var WebpackDevMiddleware = require('webpack-dev-middleware');
var WebpackHotMiddleware = require('webpack-hot-middleware');

var webpackConfig = require(path.join(__dirname, 'webpack.dev.config'));
var compiler = webpack(webpackConfig);
app.use(WebpackDevMiddleware(compiler, {
    hot: true,
    stats: { colors: true }
}));
app.use(WebpackHotMiddleware(compiler));

webpack配置

var path = require('path');
var webpack = require('webpack');
// var commonsPlugin = new webpack.optimize.CommonsChunkPlugin('common.js');


//定义了一些文件夹的路径
var ROOT_PATH = path.resolve(__dirname);
var APP_PATH = path.resolve(ROOT_PATH, 'public');
var BUILD_PATH = path.resolve(ROOT_PATH, 'build');

module.exports = {
    //插件项
    plugins: [
        // commonsPlugin
        new webpack.optimize.OccurenceOrderPlugin(),
        new webpack.HotModuleReplacementPlugin(),
        new webpack.NoErrorsPlugin()
    ],
    //页面入口文件配置
    entry: [
        'webpack-hot-middleware/client?reload=true',
        'webpack/hot/only-dev-server',
        path.resolve(APP_PATH, 'js/index.js')
    ],
    //入口文件输出配置
    output: {
        path: BUILD_PATH,
        publicPath: BUILD_PATH,
        filename: 'js/index.js'
    },
    module: {
        //加载器配置
        loaders: [
            // {   test: /\.less$/,
            //     loader: 'style-loader!css-loader!less-loader',
            // },
            {
                test: /\.js$/,
                loader: 'babel',
                exclude: /node_module/,
                query: {
                    presets: ['es2015']
                }
            },
        ]
    },
    //其它解决方案配置
    resolve: {
        root: '', //绝对路径
        extensions: ['', '.js', '.json', '.less']
    }
};

我修改js文件的时候,保存,浏览器并没有自动刷新

【热门文章】
【热门文章】