在用node方式配置webpack的热替换时,出现控制台提示更新,但页面数据未变化,求解
发布于 6 年前 作者 Ouhuang 2582 次浏览 来自 问答

1525919439(1).jpg 代码更新后 QQ截图20180510103123.jpg 微信截图_20180510103139.jpg 有老哥遇到过这个问题吗

7 回复

需要手动刷新 才能更新页面的数据。。

const config = require(’./webpack.config’) const webpack = require(‘webpack’) const WebpackDevServer = require(‘webpack-dev-server’) const path = require(‘path’)

config.entry.app.unshift( “webpack-dev-server/client?http://localhost:8080/”, ‘webpack/hot/dev-server’, ‘react-hot-loader/patch’); let compiler = webpack(config); const devServerOptions = Object.assign({}, config.devServer, { publicPath: config.output.publicPath, inline: true, stats: { colors: true }, hot: true, hotOnly: true } ); let server = new WebpackDevServer(compiler, devServerOptions); server.listen(8080, ‘localhost’, () => { console.log(‘服务启动于 http://localhost:8080’); });

这个是node server的配置

这个是 webpack.config.js的配置

const path = require(‘path’); const htmlWebpachPlugin = require(‘html-webpack-plugin’); const ExtractTextPlugin = require(‘extract-text-webpack-plugin’); const webpack = require(‘webpack’) const publicPath = ‘/’; const buildPath = ‘dist’; module.exports = { mode: ‘development’, entry: { app: [’./src/main.js’]//入口 }, output: { path: path.resolve(__dirname, buildPath), publicPath: ‘/’, filename: ‘build.js’ //出口 },

module: {
    rules: [  //配置加载器
        {
            test: /\.js$/, //匹配要处理的文件,正则匹配以.js结尾
            loader: 'babel-loader'//使用加载器的名称
        },
        {
            test: /\.css/,
            use: ['style-loader', 'css-loader']
        },
        {
            test: [/\.gif$/, /\.jpe?g$/, /\.png$/],
            loader: 'url-loader',
            options: {
                limit: 10000, //1w字节以下大小的图片会自动转成base64
            }
        }

    ]
},

plugins: [
    new htmlWebpachPlugin({
        template: './public/index.html',
        filename: 'index.html'
    }),// 生成index.html 并自己引用 build.js
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoEmitOnErrorsPlugin(),
    new webpack.NamedModulesPlugin()

],

}

在入口文件里引入一下html文件试试 require(’./index.html’)

这种问题应该是没在入口文件写这句?

hot(module)(App)

@lizhenwu 前几天重新搞了搞…是少了这里…

回到顶部