问题标签 [hot-module-replacement]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
2175 浏览

webpack-dev-server - Webpack-dev-server 不重建包

很奇怪的时刻。我有:

webpack.hmr.config.js

服务器-hmr.js

运行它:node server-hmr.js

在控制台中:-[HMR] 等待来自 WDS 的更新信号... -[WDS] 启用热模块更换。

我更改了一些文件,但捆绑包没有重建。(很少有工作 о_О - 文件是相同的)。

不知道为什么,请帮忙。有任何想法吗?

节点 - 8.9.1,“webpack-dev-server”:“^3.1.5”,“webpack”:“^4.16.3”,

0 投票
0 回答
439 浏览

angular - 如何在不刷新的情况下更新网页(Angular 6 CLI)?

我不需要 ng serve,只需要 nb build,因为它是一个 .net 核心应用程序,我只使用静态文件。

我使用过ng build --watch,但每次代码更新后,我都需要刷新页面才能看到新的变化。我看到了另一种方法,ng serve -hmr但就像我说的那样,我不使用它。

这是一种无需刷新即可实时更新代码的方法。我需要与带有热模块的 webpack 相同的流程。

0 投票
2 回答
408 浏览

javascript - NextJS 在页面/容器/组件更改时不更新,HMR 总是返回成功

我遇到了NextJS/的问题webpack

每当我进行更改时,它不会更新任何内容,直到完全重新启动所有内容。这需要很长时间来编译,最近6.4几秒钟用于客户端和2.3服务器。过去通常需要20-30几秒钟。

process.env.NODE_ENV是未定义的,webpack-hmr并且on-demand-entries两者总是在浏览器中返回空/成功。我的猜测是Next/Webpack无法查看正在更改的文件。

我的next版本是6.0.3,我Ubuntu 16.04.4 lts正在WSL努力Windows 10.0.17134

自定义服务器问题仍然存在,我调用app.getRequestHandler一次,将其分配给处理程序,然后将获取路径(/{p*})路由到处理程序Hapi v17.5.2

0 投票
0 回答
879 浏览

javascript - 将 Htmlwebpackplugin 与 Webpack-Dev-Middleware 一起使用

简短的摘要

由于 dev-middleware 依赖于内存中的文件,是否不可能将 htmlwebpackplugin 功能与 webpack-dev-middleware 结合起来?本文底部的脚本输出截图。因为我选择在我的生产配置中实现缓存散列文件名,所以我似乎不能再使用 dev-middleware。

我的设置

我的 webpack 实例有 2 个主要配置。一种用于开发(带有热重载),一种用于生产。我利用 webpack-merge 创建了一个 common.config,我最终将提取两个配置之间的共性(现在它相当空白)。在应用程序设置方面,我有一个在 Python 中单独运行的 API。

问题

在我的生产配置中,我使用 splitchunks 进行供应商/捆绑拆分以及一些最小化。它工作得很好。但是,当我尝试运行我的开发环境时,虽然它正在根据终端创建适当的开发包[即没有散列],但无法找到 index.html 文件(可能是因为 webpack-dev-中间件在内存中寻找东西)。结果,我看不到我的开发环境,也看不到任何热重载更改?以前我会使用 npm run build:production 生成所有捆绑文件,然后使用 NPM start。我想 dev-middleware 会将它的内存版本的 bundle.js 更改覆盖在我磁盘上的文件上,但是现在我在 prod 上使用散列文件名,我真的不能再这样做了吗?

Package.json 脚本

server.js 的相关部分

common.config.js

dev.config.js

这是使用 npm run build:production 后我的 index.html 文件的示例。如您所见,index.html 的内存版本可能无法再与散列文件名一起使用?

其他注意事项:

  • 在最新版本的 webpack 4 上。
  • 我的生产版本工作正常

非常感谢任何帮助。

运行 build:production 时的输出 当我运行 npm start 时输出

更新:我已将 rimraf dist 换成干净的 webpack 插件并将其移至我的 common.config。这样,在每次构建时,它都会在生成 index.html 之前进行清理。但是,我注意到当我使用 npm start 时,终端中的输出显示文件已发出......我在任何地方都找不到它们?在调查了 webpack-dev-middleware 之后,似乎他们将东西存储在内存中. 这大概是核心问题。如果 htmlwebpack 插件在内存中或者我可能需要维护一个单独的 index.html 文件,我如何将它与 dev-middleware 之类的东西联系在一起?我猜这个流程之前工作的原因是因为我对 prod 和 dev 都有 bundle.js 的静态名称,所以内存版本没有问题。现在这些名称是从 prod 版本中散列的......它不知道该怎么做?

0 投票
1 回答
1273 浏览

reactjs - Yarn Workspaces 和 Webpack 热模块重载 React App

我正在使用 Yarn Workspaces 来管理单声道存储库。我正在使用 webpack 4 进行热模块重新加载。在我的 mono repo 中,我有一个应用程序、一个 UI 组件库和另一个用于授权用户的组件库(auth 包)。我在应用程序和身份验证包中都使用了组件库。应用程序本地的所有内容热重载都很好,但 UI 组件库不会热重载 - 它需要完全刷新。

我尝试使用 接受 UI 组件库module.hot.accept(...),但似乎没有接受。

猜测这个问题有点牵强,但有什么想法吗?

0 投票
1 回答
233 浏览

asp.net-core - 使用 ServiceStack 替换 Webpack 中间件热模块(无 MVC)

当我在 VS Code 中调试我的项目时,我的 NET Core Web 应用程序会在 wwwroot 中提供内容。

有没有办法在使用 ServiceStack 时也添加 MVC 使用的 Webpack 中间件来启用 HMR?

0 投票
2 回答
3271 浏览

angular - 热模块更换正在重新加载整个应用程序而不是特定组件

我创建了一个新的 Angular 项目并按照此处的说明设置 HMR: https ://github.com/angular/angular-cli/wiki/stories-configure-hmr

该项目包含主组件(父组件),它具有router-outlet并链接到 3 个延迟加载的子组件。

注意:我也在使用自定义RouteReuseStrategy,但据我测试它对 HMR 没有影响。

无论我要更改什么文件 - .html 或 .ts(父/子),整个应用程序都会重新加载。

我已经建立了一个基本的仓库,可以在这里找到: https ://github.com/ronfogel/demo-hmr

0 投票
0 回答
126 浏览

webpack - webpack 的 HMR 是否与自定义后端一起使用?

我有一个 HMR 问题。我用来webpack-dev-server为我bundle.jsbundle.js. <script>HMR 在此设置中似乎不起作用。这是预期的吗?HMR 是否仅在应用程序本身由 提供服务时才起作用webpack-dev-server

0 投票
0 回答
40 浏览

webpack - HMR 中的 Webpack 应用方法

我正在阅读webpack 文档

我看过这句话:

apply 方法将所有更新的模块标记为无效。对于每个无效模块,模块或其父模块中都需要有一个更新处理程序。否则,无效标志会冒泡并使父级无效。每个气泡一直持续到应用程序的入口点或具有更新处理程序的模块到达(以先到者为准)。如果它从入口点冒泡,则该过程失败。

之后,所有无效模块都被处理(通过处理处理程序)并卸载。然后更新当前哈希并调用所有接受处理程序。运行时切换回空闲状态,一切都照常进行。

只是为了确保我理解这个过程,所以在加载更新后,apply函数进入场景,试图解决所有问题,如果在过程中发现没有updated modules返回?errorhandler

0 投票
0 回答
88 浏览

asp.net-core - 阻止 aspnet 核心 webpack 中间件进行首次运行的 webpack 构建

我遇到了一个问题,如果我在 Visual Studio 中运行“无调试启动”会话时在 dotnet 核心 Asp.Net 应用程序(例如在控制器中)中更​​改并保存任何 c# 代码,它将首先运行 -运行 Webpack 构建,即使没有更改任何 javascript 代码:

这使得更改 dotnet 代码变得非常缓慢。但是,如果我只处理 javascript 代码(例如 vue 文件),那么热模块替换效果很好,并且更新非常快,无需进行完整的 webpack 构建。

我正在开发一个尚未移植到 Webpack 4 的应用程序,但我想知道这是否与我的 asp.net 配置有关。

在调用之前,我在 startup.cs 中使用以下内容app.UseStaticFiles();

如果 javascript 文件没有更改,有没有办法阻止首次运行的 webpack 构建?似乎只有在 javascript 文件发生更改时才应由 dotnet 调用 webpack 构建,而不是在纯 c# 代码中。