插件

¥Plugins

插件可用于扩展 reveal.js 的附加功能。要使用插件，你需要做两件事：

¥Plugins can be used to extend reveal.js with additional functionality. To make use of a plugin, you'll need to do two things:

1. 在文档中包含插件脚本。（某些插件可能也需要样式。）

   ¥Include the plugin script in the document. (Some plugins may require styles as well.)

2. 在初始化时，通过将插件添加到 plugins 数组中，告知 reveal.js 该插件。

   ¥Tell reveal.js about the plugin by including it in the plugins array when initializing.

示例如下：

¥Here's an example:

<script src="plugin/markdown/markdown.js"></script>
<script>
  Reveal.initialize({
    plugins: [RevealMarkdown],
  });
</script>

如果你使用的是 ES 模块，我们还为所有内置插件提供模块导出：

¥If you're using ES modules, we also provide module exports for all built-in plugins:

<script type="module">
  import Reveal from 'dist/reveal.esm.js';
  import Markdown from 'plugin/markdown/markdown.esm.js';
  Reveal.initialize({
    plugins: [Markdown],
  });
</script>

内置插件

¥Built-in Plugins

我们默认的 演示文稿样板 包含一些常用插件，这些插件增加了对 Markdown、代码高亮 和 演讲者备注 的支持。

¥A few common plugins which add support for Markdown, code highlighting and speaker notes are included in our default presentation boilerplate.

这些插件与 reveal.js 代码库一起分发。以下是所有内置插件的完整列表。

¥These plugins are distributed together with the reveal.js repo. Here's a complete list of all built-in plugins.

如果你将 .js 替换为 .esm.js，以上所有内容均可作为 ES 模块使用。

¥All of the above are available as ES modules if you swap .js for .esm.js.

API

我们提供 API 方法来检查当前已注册的插件。如果你想手动调用任何已注册插件实例的方法，也可以检索它们的引用。

¥We provide API methods for checking which plugins that are currently registered. It's also possible to retrieve a reference to any registered plugin instance if you want to manually call a method on them.

import Reveal from 'dist/reveal.esm.js';
import Markdown from 'plugin/markdown/markdown.esm.js';
import Highlight from 'plugin/highlight/highlight.esm.js';

Reveal.initialize({ plugins: [Markdown, Highlight] });

Reveal.hasPlugin('markdown');
// true

Reveal.getPlugin('markdown');
// { id: "markdown", init: ... }

Reveal.getPlugins();
// {
//   markdown: { id: "markdown", init: ... },
//   highlight: { id: "highlight", init: ... }
// }

依赖 4.0.0

¥Dependencies 4.0.0

此功能保留用于向后兼容，但自 reveal.js 4.0.0 起已弃用。在旧版本中，我们使用内置的依赖加载器来加载插件。我们放弃了这种做法，因为脚本的最佳加载和打包方式可能因用例而异。如果你需要加载依赖，请使用 <script defer> 标签将其包含进去。

¥This functionality is left in for backwards compatibility but has been deprecated as of reveal.js 4.0.0. In older versions we used a built-in dependency loader to load plugins. We moved away from this because how scripts are best loaded and bundled may vary greatly depending on use case. If you need to load a dependency, include it using a <script defer> tag instead.

依赖按其出现的顺序加载。

¥Dependencies are loaded in the order they appear.

Reveal.initialize({
  dependencies: [
    { src: 'plugin/markdown/markdown.js', condition: () => {
        return !!document.querySelector( ’[data-markdown]’ );
    } },
    { src: 'plugin/highlight/highlight.js', async: true }
  ]
});

每个依赖对象可用的属性如下：

¥The following properties are available for each dependency object:

• src：要加载的脚本路径

  ¥src: Path to the script to load

• 异步：[可选] 标志脚本是否应在 reveal.js 启动后加载，默认为 false

  ¥async: [optional] Flags if the script should load after reveal.js has started, defaults to false

• 回调：[可选] 脚本加载完成后执行的函数

  ¥callback: [optional] Function to execute when the script has loaded

• 条件：[可选] 脚本加载完成后必须返回 true 的函数

  ¥condition: [optional] Function which must return true for the script to be loaded