控制台输出Ignored an update to unaccepted module
错误,如何修复?
log.js:25 Ignored an update to unaccepted module ./src/print.js -> 1
log.js:25 [HMR] The following modules couldn't be hot updated: (They would need a full reload!)
log.js:25 [HMR] - ./src/print.js
整个控制台消息是:
log.js:23 [HMR] Waiting for update signal from WDS...
log.js:23 [HMR] Waiting for update signal from WDS...
client?cd17:64 [WDS] Hot Module Replacement enabled.
client?cd17:64 [WDS] Hot Module Replacement enabled.
client?cd17:67 [WDS] App updated. Recompiling...
client?cd17:67 [WDS] App updated. Recompiling...
client?cd17:67 [WDS] App updated. Recompiling...
client?cd17:67 [WDS] App updated. Recompiling...
client?cd17:193 [WDS] App hot update...
log.js:23 [HMR] Checking for updates on the server...
client?cd17:193 [WDS] App hot update...
log.js:23 [HMR] Checking for updates on the server...
log.js:25 Ignored an update to unaccepted module ./src/print.js -> 1
./node_modules/webpack/hot/log.js.module.exports @ log.js:25
onUnaccepted @ only-dev-server.js:25
hotApply @ bootstrap e5893b5…:437
(anonymous) @ only-dev-server.js:20
log.js:25 [HMR] The following modules couldn't be hot updated: (They would need a full reload!)
./node_modules/webpack/hot/log.js.module.exports @ log.js:25
./node_modules/webpack/hot/log-apply-result.js.module.exports @ log-apply-result.js:12
(anonymous) @ only-dev-server.js:39
log.js:25 [HMR] - ./src/print.js
./node_modules/webpack/hot/log.js.module.exports @ log.js:25
(anonymous) @ log-apply-result.js:14
./node_modules/webpack/hot/log-apply-result.js.module.exports @ log-apply-result.js:13
(anonymous) @ only-dev-server.js:39
log.js:23 [HMR] Nothing hot updated.
log.js:23 [HMR] App is up to date.
index.js:8 Accepting the updated printMe module!
log.js:23 [HMR] Updated modules:
log.js:23 [HMR] - ./src/print.js
log.js:23 [HMR] App is up to date.
以下是我的代码:
webpack.config.js:
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const webpack = require('webpack');
module.exports = {
devtool: 'inline-source-map',
devServer: {
contentBase: path.resolve(__dirname, 'dist'),
hotOnly: true,
},
entry: {
app: './src/index.js',
print: './src/print.js'
},
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, 'dist'),
},
plugins: [
new HtmlWebpackPlugin({
title: 'Hot Module Replacement',
filename: 'index.html',
}),
new CleanWebpackPlugin(['dist']),
new webpack.HotModuleReplacementPlugin(),
new webpack.NamedModulesPlugin(),
],
};
./src/index.js:
import _ from 'lodash';
import printMe from './print.js';
if(module.hot) {
module.hot.accept('./print.js', function() {
console.log('Accepting the updated printMe module!');
document.body.removeChild(element);
element = component();
document.body.appendChild(element);
});
}
let element = component();
function component() {
const element = document.createElement('div');
const btn = document.createElement('button');
element.innerHTML = _.join(['Hell', 'webpack'], ' ');
btn.innerHTML = 'Click me and check the console!';
btn.onclick = printMe;
element.appendChild(btn);
return element;
}
document.body.appendChild(element);
./src/print.js:
export default function printMe() {
//console.log('I get called from print.js!');
console.log('Updating print.js...')
}
package.json:
{
"name": "webpack-demo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "webpack",
"start": "webpack-dev-server --open"
},
"keywords": [
"webpack",
"demo"
],
"author": "",
"license": "MIT",
"dependencies": {
"lodash": "^4.17.4"
},
"devDependencies": {
"clean-webpack-plugin": "^0.1.16",
"html-webpack-plugin": "^2.29.0",
"webpack": "^3.4.1",
"webpack-dev-server": "^2.6.1"
}
}
其他环境:
请帮帮我。
发布于 2017-08-06 15:35:43
经过调试和测试,我想我知道答案了。
Webpack开发服务器为每个条目创建一个客户端脚本。
当我不编写任何HMR接口时,控制台输出如下:
对于app(./src/index.js)
客户端脚本来说,index.js
将接受它的依赖项print.js
的更改。
但是对于print(./src/print.js)
客户端脚本来说,没有什么能够接受它的依赖项-- print.js
的改变。
因此,只在index.js
中编写HMR接口不适用于第二种情况,它会引发Ignored an update to unaccepted module
错误。
发布于 2019-03-20 00:31:13
将print.js从webpack配置的进入道具中删除,可以解决这一问题。
发布于 2019-08-28 18:26:16
在hotOnly: true
的devServer对象中将webpack.config.js转换为hot: true
可以解决这一问题。
参考:Webpack文献
https://stackoverflow.com/questions/45520707
复制相似问题