最近开始使用 sveltejs 模板玩 Svelte。一切正常，但是当我对文件进行任何更改时，它不会将更改热重新加载到 Web 浏览器，因此我必须手动刷新页面才能看到更改。设置中是否有任何选项可以启用该功能，或者此时不可能？
问问题
13966 次
2 回答
16
默认模板 ( https://github.com/sveltejs/template ) 使用Rollup，它不支持热模块重新加载。webpack版本( https://github.com/sveltejs/template-webpack )将支持 HMR，但首先我们需要为 Svelte 本身添加一些钩子以使其成为可能。您可以在此处跟踪一个问题- 希望我们能够很快完成这项工作。
在那之前，Tholle 建议使用 livereload 插件可能是最好的折衷方案。
于 2019-04-25T14:38:58.437 回答
14
只是为了与作者就他自己的库相矛盾，我要争辩说，公认的答案都是错误的。
Rollup可以使用带有rollup-plugin-hot 的HMR 。正如之前在评论中指出的那样，Nollup也可以做到。
这样，您就可以将更新的代码推送到浏览器并刷新（即销毁+重新创建）整个应用程序，而无需重新加载页面。但是，如果有的话，这并不比重新加载整页好得多。
您想要的是仅替换受代码更新影响的 Svelte 组件，以便保留您当前的应用程序状态，并且您还希望尽可能保留更新组件的状态。为此，您可以将rollup-plugin-svelte-hot与 Rollup / Nollup 一起使用，或者将svelte-loader-hot与 Webpack 一起使用。
在等待官方支持之前，我维护了官方模板 + HMR 的克隆：用于 Rollup / Nollup 的svelte-template- hot和用于 Webpack的 svelte-template-webpack-hot。Sapper还有sapper -template-hot（仅支持 Webpack）。而且，为了完整起见，svelte-native-template（不是我维护的）还包括 HMR 支持。
Svelte 仍未正式支持 HMR。Rich的回答中提到的问题已关闭。现在可以在此问题中跟踪进度。
（当然，Rich 的答案在最初写的时候是正确的。从官方的角度来看，它仍然是正确的。而且这个答案是为我自己的项目做广告的无耻插件，因为这个问题在谷歌中排名很高，但我希望它是还是有用的。）
于 2019-11-25T11:40:41.043 回答