Previous tutorial: Developing Discourse Plugins - Part 1 - Create a basic plugin
入门:Handlebars 模板
Discourse 的客户端应用程序是使用 Ember.js Javascript 框架编写的。Ember 在所有 HTML 模板中使用 Handlebars。该链接提供了对模板语言的出色介绍,因此请务必仔细阅读。
问题:向 Discourse 用户界面添加元素
许多插件需要添加和扩展 Discourse Web 界面。我们提供了一种称为“插件插口”(plugin outlets)的机制来实现此目的,该机制存在于 Handlebars 模板中。
如果您浏览 Discourse Handlebars 模板,您会经常看到以下标记:
<PluginOutlet @name="edit-topic" />
这声明了一个名为“edit-topic”的插件插口。它是模板中的一个扩展点,插件作者可以利用它来添加自己的 Handlebars 标记。
在编写插件时,请在您想要修改的 Discourse Handlebars 模板(在 .hbs 文件中)中查找 <PluginOutlet />。如果没有,请告诉我们进行扩展!如果您有好的用例,我们将很乐意添加它们。如果您想让我们做得更容易、更快,请在 github 上提交一个 pull request!
如果您想查看插件插口存在的一些位置,如果您使用的是 OSX 或 Linux,可以运行以下命令:
git grep "<PluginOutlet" -- "*.hbs"
您还可以通过打开 Discourse 开发者工具栏 在 Discourse 站点上显示插件插口。只需在 Discourse 论坛的浏览器控制台中输入 enableDevTools(),然后单击页面左侧出现的插头图标即可。
连接到插件插口
找到要添加到的插件插口后,您必须为其编写一个 connector。Connector 实际上只是一个 Handlebars 模板,其文件名中包含 connectors/<outlet name>。
例如,如果 Discourse Handlebars 模板包含:
<PluginOutlet @name="evil-trout" />
那么您在 connectors/evil-trout 目录中创建的任何 Handlebars 文件都将自动追加到此处。因此,如果您创建了文件:
plugins/hello/assets/javascripts/discourse/connectors/evil-trout/hello.hbs
内容如下:
<b>Hello World</b>
Discourse 会将 <b>Hello World</b> 插入到模板中的该位置。
请注意,我们将文件命名为 hello.hbs——文件名的最后一部分并不重要,但它在所有插件中必须是唯一的。将其命名为描述您要扩展的功能的内容会很有用。这将使将来调试更容易。
故障排除
- 仔细检查 connector 的名称,确保它与插件名称完全匹配。
更多信息
系列中的更多内容
第 1 部分:插件基础知识
第 2 部分:本主题
第 3 部分:站点设置
第 4 部分:git 设置
第 5 部分:管理界面
第 6 部分:验收测试
第 7 部分:发布您的插件
此文档是版本控制的 - 在 github 上建议更改。



