问题标签 [hot-module-replacement]

我已经安装了我需要的所有东西（webpack、webpack-server），配置了我的 webpack.config.js 和 package.json，但localhost:8080仍然无法安全呈现。它也不会安全地呈现在localhost:8080/webpack-dev-server/index.html上。在手动重新加载时，它可以完美呈现。

包.json：

webpack.config.js

npm run dev成功执行，但在对父文件夹中的 index.html 进行一些更改后，我还必须手动重新加载页面。此外，当我更改我的 .js 文件时，我总是必须在我的 cmd 中手动运行webpack 。如果我是正确的，热加载也应该解决这个问题。

我还要补充一点，当我运行CTRL+s时，应用程序正在重新编译，但它实际上并没有重新编译。

首先，该项目基于著名的 .Net Core 和 ng2 模板 for Visual Studio 2015 Link to VS 2015 Template Tutorial

这个模板非常好，一切都按预期正常工作。Webpack/HMR 也在工作，每当我更改 .html 或 .ts 文件时，我都可以立即看到更改。

但是，它使用的是非常旧版本的库。当我决定将所有库升级到最新版本（WebPack 到 2.2.1）时，问题就开始了。我遇到了很多错误，因为在这次升级过程中发生了重大的重大变化。除了最后一个问题外，我设法解决了几乎所有问题并让应用程序像往常一样启动并运行。

它不再使用HotModuleReplacement (HMR). 当我在浏览器上刷新 (F5) 时，所有更改都会反映在页面上。

我们可以在这里看到它确实知道更改，编译并返回了最新（正确）的 html 代码，但它无法将其重新加载到页面上。它一直在说Selector 'app' did not match any elements.

包.json

对于一个众所周知的 angular-universal 问题，我已经复制了 2 个解决方法 ts 文件并添加到 boot-server 和 boot-client 文件中。

webpack.config.vendor.js

正如这里所建议的，我已包含aspnet-prerendering在供应商条目中。

webpack.config.js

引导服务器.ts

很明显，<app></app>页面加载时是在页面上的。否则，页面将不会首先加载。但是当底层文件发生变化时，它突然找不到了。

引导客户端.ts

索引.html

你们能帮我解决这个错误吗？谢谢。

我确实尝试将这个放在 Plunkr 上，但我不知道如何将 .NetCore 文件上传到 Plunkr。

所以我有以下用于热重载的 webpack 服务器配置：

entry看起来像这样：

现在最初我有这个：

和

但是在webpack-hot-middleware上创建问题后，我从开发人员那里得到了这条评论，解释说查询字符串格式将配置应用于客户端，而其他格式将其应用于服务器。

我的问题是，有没有办法应用reload=true不使用查询字符串，我发现这种格式真的很难遵循并且难以跟踪。

任何 HTML 更改都会触发 HMR 重新加载。但由于某种原因，打字稿文件不再起作用。他们在 VS 2015 中工作，但是当我昨天搬到 VS 2017 时停止工作。

在 Angular 2 应用程序中使用 VS 2017 和 Webpack。

就像我说的，HTML 文件仍然可以正常工作，只是 TS 文件是问题所在。我对触发重新加载的机制知之甚少，谷歌搜索并没有让我有任何收获。我将不胜感激任何人都可以给我的帮助。

谢谢！

嗡嗡声

以上是我的 bundle.js 文件。

正如您所看到的，我的 css 组件作为 accept 函数的第一个参数被调用了两次，我认为这会导致问题，但我不知道为什么它会被调用两次。我还附上了我的配置文件和 index.js。

顺便说一句，我也想知道如何使用 module.hot.accept 功能。

它在没有参数的情况下很好地工作，但如果有任何参数，它就会停止工作。

参数，当我昨天阅读文档时，它们是文档所说的“依赖项”，但答案过于模糊和简单。

我请你解释一下这个热接受函数是如何工作的，我应该使用哪些参数以及我不应该做的事情。

这有点极端，但知道会有所帮助。

在使用 webpack-dev-server 开发扩展以保持扩展代码最新时，收听“webpackHotUpdate”会很有用

带有内容脚本的 Chrome 扩展程序通常有两个方面：

1. 背景
2. 注入内容脚本

当使用带有 HMR 的 webpack-dev-server 时，后台页面保持同步就好了。然而，内容脚本需要重新加载扩展以反映更改。我可以通过监听来自 hotEmmiter 的“webpackHotUpdate”事件然后请求重新加载来解决这个问题。目前，我以一种可怕且非常不可靠的黑客方式进行这项工作。

XX 仅表示当前分配给发射器的编号。正如你可以想象的那样，每当构建发生变化时，它就会发生变化，所以这是一种非常临时的概念证明。

我想我可以设置自己的套接字，但这似乎有点过头了，因为事件已经在传输，我只是想听。

我最近才更加熟悉 webpack 生态系统，因此非常感谢任何指导。

找出解决这些webpack.config.js问题的方法让我大吃一惊。在entry属性中，它说找不到定义的目录；./node_modules/由于软件包位于文件夹中，因此我尝试添加node_modules，但仍然失败。在plugins财产中，它说：

new webpack.HotModuleReplacementPlugin 不是构造函数

我试图删除webpack但它说：

HotModuleReplacementPlugin 未定义

webpack.config.js：

我非常感谢任何可以帮助我解决这些问题的人的回答。

我想在生产环境中运行 HMR，使用它进行无缝的应用程序更新。我似乎找不到任何有关如何执行此操作的文档或教程。

我的设置目前是“无服务器”的，静态数据由 AWS S3 提供。我的第一个想法是我会创建某种“更新”服务器，让 HMR 客户端轮询更新，然后魔法就会起作用。

我的问题：

• a）我如何在生产中运行它（最佳）
• b) 为此，“更新”服务器必须知道模块更改，如何？
  • 我知道带有更新的 json 文件是 HMR 了解更改所依赖的，我是否必须将某种文件推送到服务器？
  • 或者，我是否让服务器以某种方式监视 S3 文件并重新编译，进而触发更新。

一个完整的解决方案会很棒，但关于它如何工作的一些 sudo 逻辑也会很棒。

我正在尝试将 Webpack热模块替换配置为与远程服务器一起使用。

我正在 Salesforce.com 平台上构建一个应用程序，并希望配置内部应用程序页面以使用ngrok和webpack-dev-server从我的本地计算机获取所有必要的文件。实际结果与 HMR 的行为相同——使用socketio替换更改的模块。我使用angular-webpack2-starter种子项目仅从ngrok 对其进行测试。但是当我从ngrok端点打开页面并更新某些模块时，与 HMR 的连接就会丢失。

日志截图在这里

运行 Webpack Dev Server 时，它会创建哈希文件，但不会创建真正的物理文件 - 所以会出现 404 错误但是如果使用 Watcher 运行 Builder，它会创建真正的哈希文件，我可以直接从服务器获取它

但是：HMR 说 Get different Hash 然后由 Builder 创建

SO：我有一个真正的哈希包，可以从http://localhost:8000/获取...，但我的浏览器想要获取资源文件夹中不存在的另一个哈希包

奇怪的事情：下一个字符串显示了两次

2 raven.js:80 [WDS] App updated. Recompiling... -> 两次

配置如下：