插件开发的热重载?

大家好。如果这个问题已经有人解答过(我没找到),在此先致歉:

在本地机器上开发 Discourse 插件通常相当缓慢。每次重新加载本地运行的应用(以查看代码更改)都需要超过 5 秒。因此,我修改了 html/hbs 或 js 文件,保存后,需要重新加载应用 [编辑:刷新浏览器],然后等待 5 秒以上才能看到更改。

有没有办法在本地 Discourse 插件开发中实现热重载(即自动更新本地视图)?

看起来 CSS 文件会自动更新,但 html/hbs 或 js 文件则不会。

虽然我留意着是否有任何线索,但我觉得情况就是这样。而且据我所见,在 Mac 上问题要严重得多。

2 个赞

大家好,

你们可以相当有把握地认为,只有在 API 发生变更时(也就是 Ruby on Rails 代码)才需要重启服务器。

如果只修改了 JavaScript 或 HBS 文件,只需刷新浏览器即可获取变更。

你们可能已经注意到,CSS 文件的变更甚至都不需要刷新!:slight_smile:

3 个赞

我在这里讨论的是刷新浏览器,以及是否有热重载功能可以避免这样做。真正耗时的是浏览器刷新,查看任何更改都需要 5 秒以上。

如果我必须停止并重新加载服务器(例如当我修改 plugin.rb 时),那可能需要 60 秒。

当然,热重载如今是许多技术栈开发的标准(我最熟悉的是 Angular,它支持这一标准),对开发来说非常棒。我相信在 Rails 中可以通过 webpack 实现热重载(但我不太确定)。我的感觉是,Discourse 开发中目前不支持热重载,但我想确认一下,因为如果支持的话会非常棒。

您需要刷新浏览器以加载更新后的 JavaScript 文件。

2 个赞

这将在 EmberCLI: Coming to a Discourse near you! 中发布。

8 个赞

事实上,您现在就可以使用 Ember CLI 配合 Discourse 主分支来实现这一功能!

6 个赞

听起来很棒,谢谢。要在本地开发中使用它,除了从 GitHub 下载最新版本的 Discourse 到本地计算机外,还需要做其他操作吗?

1 个赞

你需要先查看最新的 Discourse,然后执行类似以下操作:

  1. 启动 API 服务器:rails s

  2. 启动 Ember 服务器:

    1. 进入正确的文件夹 cd app/assets/javascript/discourse
    2. 安装依赖包 yarn
    3. 运行 Ember CLI:ember serve --proxy "http://localhost:3000"

之后,你可以打开 http://localhost:4200,此时你应该已经在 Ember CLI 中运行并启用了热重载功能。

8 个赞

我很兴奋地升级了我的本地 Discourse 实例,现在本地已运行 2.8 版本。但我还无法让 HTML 和 JS 更改实现热重载。

我是这样运行的:

进入本地的 discourse 文件夹

$ redis-server // 启动服务器

$ rails s // 启动 Rails 应用

$ yarn // 只需首次运行,我猜

$ bin/ember-cli // 启动 Ember CLI。命令 ember serve --proxy "http://localhost:3000" 不知为何报错

这成功让应用在 localhost:4200 上运行。

我已在本地 Discourse 实例中添加了插件,该插件在 localhost:4200 上成功显示。但是,如果我修改 HTML 或 JS 文件,这些更改只有在刷新浏览器后才会显示在本地运行的应用中。

我还需要做其他什么才能让热重载生效吗?

2 个赞

你好。在 Discourse 中,ember-cli 是否支持热重载?我仍然遇到之前帖子中提到的问题。按照那些步骤操作后,热重载依然无法生效(即:我仍然需要刷新浏览器才能看到 HTML 和 JavaScript 的更改,而且在文件修改后保存时,终端中 ember-cli 的输出似乎也没有响应)。

热重载对我来说仍然无法工作。除了这些步骤之外,我还需要做其他什么吗?

我所做的是

./bin/rails s

在一个终端中,以及

./bin/ember_cli

在另一个终端中。

是的,谢谢。我也这样做。你是否有 HTML 和 JS 文件的热(即自动)重载功能?

你是指 hbs 文件吗?

是的,我不明白浏览器中所谓的“实时重载”(liveReload)是怎么回事,尽管:

image

并且存在:

<script type="text/javascript" src="http://localhost:4200/_lr/livereload.js?port=4200&host=localhost&path=_lr/livereload"></script>

以及

<script src="/ember-cli-live-reload.js" type="text/javascript"></script>

是的——我指的是 HBS 文件。

非常希望能实现实时重载(尤其是针对 JavaScript 文件)。当我在其他支持实时重载作为标准功能的上下文中编写代码时,实时重载使编码过程快得多,也更有乐趣。

1 个赞

一些额外信息:

ember-cli/ember-cli-inject-live-reload:将实时重载脚本注入 HTML 内容的 Ember CLI 插件(github.com)

"livereload.js 会发起一个 WebSocket 连接回 Ember CLI。这使得 Ember CLI 能够在 JavaScript 或样式更改后通知浏览器触发刷新。”

我很好奇为什么浏览器会忽略这一点——我怀疑这是否与浏览器中有关站点安全的某个选项有关?

我不确定,但我确实在其他上下文或其他框架中成功实现了浏览器的实时重载。(不确定 Ember 的情况——我只在编写 Discourse 相关内容时使用过它。)

我很想知道实时重载是否是预期功能。根据之前的讨论,答案似乎是肯定的。如果是这样,我想知道 Discourse 团队是否启用了实时重载,以及他们是否做了我尚未做到的某些操作。

1 个赞

脚本的存在无疑是意图的体现,这里没有任何事情是偶然的吧?

因此,我在想这是否是本地浏览器配置问题,或是其他配置问题。

更多关于 livereload.js 的信息:livereload/livereload-js: 与服务器通信并实现热重载的 LiveReload JavaScript 代码 (github.com)

如果能得到官方关于此处热重载应工作到何种程度的说明,以及它是否仅限于客户端的 CSS 更新,那将是非常好的。

1 个赞

页面的自动刷新由 ember CLI 处理。目前,主题和插件资源由 Rails 应用编译并提供,而非 Ember CLI。因此,主题/插件的更改不会自动刷新页面。

这可能是我们未来可以改进的地方。但就目前而言,这是预期行为。

5 个赞