首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >忽略对未接受模块的更新。

忽略对未接受模块的更新。
EN

Stack Overflow用户
提问于 2017-08-05 10:11:07
回答 3查看 10.7K关注 0票数 5

控制台输出Ignored an update to unaccepted module错误,如何修复?

代码语言:javascript
运行
复制
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

整个控制台消息是:

代码语言:javascript
运行
复制
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:

代码语言:javascript
运行
复制
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:

代码语言:javascript
运行
复制
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:

代码语言:javascript
运行
复制
export default function printMe() {
  //console.log('I get called from print.js!');
  console.log('Updating print.js...')
}

package.json:

代码语言:javascript
运行
复制
{
  "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"
  }
}

其他环境:

  • 节点v7.4.0
  • 国家预防机制4.0.5
  • macOS塞拉利昂10.12
  • Chrome v59.0.3071.115

请帮帮我。

EN

回答 3

Stack Overflow用户

发布于 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错误。

票数 3
EN

Stack Overflow用户

发布于 2019-03-20 00:31:13

将print.js从webpack配置的进入道具中删除,可以解决这一问题。

票数 0
EN

Stack Overflow用户

发布于 2019-08-28 18:26:16

hotOnly: true的devServer对象中将webpack.config.js转换为hot: true可以解决这一问题。

参考:Webpack文献

票数 -3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/45520707

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档