[英]HMR isn't working after moving files to /app folder
Hi I'm currently trying to learn how to use express along with webpacks HMR, and every time I update and save a file it gives me the error: 嗨,我目前正在尝试学习如何将express与webpacks HMR一起使用,并且每次更新并保存文件时,都会出现以下错误:
"The following modules couldn't be hot updated: (Full reload needed)" "./app/components/App.js" “无法热更新以下模块:(需要完全重新加载)”“ ./app/components/App.js”
Is there something wrong with my current config files? 我当前的配置文件有问题吗?
So I have a directory structure like this: 所以我有一个这样的目录结构:
todos
|
app
|
package.son
server.js
webpack.config.js
and I have a webpack.config.js file and a server.js file that looks like the following: 并且我有一个webpack.config.js文件和一个server.js文件,如下所示:
var path = require('path');
var webpack = require('webpack');
module.exports = {
context: path.join(__dirname + "/app"),
entry: ['./index'],
output: {
path: "/bundle",
publicPath: '/static/',
filename: "bundle.js"
},
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
loader: 'babel',
query: {
presets: ['react', 'es2015']
}
}
]
},
resolve: {
extensions: ['', '.js', '.jsx']
}
};
server.js server.js
var webpack = require('webpack')
var webpackDevMiddleware = require('webpack-dev-middleware')
var webpackHotMiddleware = require('webpack-hot-middleware')
var config = require('./webpack.config')
var app = new (require('express'))()
var port = 3000
var compiler = webpack(config)
app.use(webpackDevMiddleware(compiler, { noInfo: true, publicPath: config.output.publicPath }))
app.use(webpackHotMiddleware(compiler))
app.get("/", function(req, res) {
res.sendFile(__dirname + '/app/index.html')
})
app.listen(port, function(error) {
if (error) {
console.error(error)
} else {
console.info("==> 🌎 Listening on port %s. Open up http://localhost:%s/ in your browser.", port, port)
}
})
Have you tried accepting the module? 您是否尝试过接受该模块? In the Webpack HMR documentation it says the following: 在Webpack HMR 文档中,它表示以下内容:
A module can only be updated if you “accept” it. 如果您“接受”模块,则只能对其进行更新。 So you need to module.hot.accept the module in the parents or the parents of the parents. 因此,您需要module.hot.accept在父母或父母的父母中接受模块。 For example, a router or a subview would be a good place. 例如,路由器或子视图将是一个好地方。
Try this in your index.js file or wherever module you want HMR to reload: 在您的index.js文件或希望HMR重新加载的任何模块中尝试以下操作:
if (module.hot) {
module.hot.accept();
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.