注入器

注入器用于将静态代码片段添加到生成的 HTML 文件的 <head> 或/和 <body>。Hexo 在执行 after_render:html 过滤器之前运行注入器。

¥An injector is used to add static code snippet to the <head> or/and <body> of generated HTML files. Hexo run injector before after_render:html filter is executed.

概要

¥Synopsis

hexo.extend.injector.register(entry, value, to);

条目 <string>

¥entry <string>

代码将注入 HTML 中的位置。

¥Where the code will be injected inside the HTML.

支持这些值：

¥Support those values:

  • head_begin：在 <head> 之后立即注入代码片段（默认）。

    ¥head_begin: Inject code snippet right after <head> (Default).

  • head_end：在 </head> 之前插入代码片段。

    ¥head_end: Inject code snippet right before </head>.

  • body_begin：在 <body> 之后立即注入代码片段。

    ¥body_begin: Inject code snippet right after <body>.

  • body_end：在 </body> 之前插入代码片段。

    ¥body_end: Inject code snippet right before </body>.

值 <string> | <Function>

¥value <string> | <Function>

支持返回字符串的函数。

¥A function that returns string is supported.

要注入的代码片段。

¥The code snippet to be injected.

到 <string>

¥to <string>

将代码片段注入哪个页面。

¥Which page will code snippets being injected.

  • default：注入到每个页面（默认）。

    ¥default: Inject to every page (Default).

  • home：仅注入主页（其中 is_home() 助手为 true）

    ¥home: Only inject to home page (which has is_home() helper being true)

  • post：仅注入帖子页面（其中 is_post() 助手为 true）

    ¥post: Only inject to post pages (which has is_post() helper being true)

  • page：仅注入页面（其中 is_page() 助手为 true）

    ¥page: Only inject to pages (which has is_page() helper being true)

  • archive：仅注入存档页面（其中 is_archive() 助手为 true）

    ¥archive: Only inject to archive pages (which has is_archive() helper being true)

  • category：仅注入分类页面（其中 is_category() 助手为 true）

    ¥category: Only inject to category pages (which has is_category() helper being true)

  • tag：仅注入标签页面（其中 is_tag() 助手为 true）

    ¥tag: Only inject to tag pages (which has is_tag() helper being true)

  • 也可以使用自定义布局名称，请参阅 写入 - 布局。

    ¥Custom layout name could be used as well, see Writing - Layout.

还有其他内部函数，请参阅 hexojs/hexo#4049 了解更多详情。

¥There are other internal functions, see hexojs/hexo#4049 for more details.

示例

¥Example

const css = hexo.extend.helper.get("css").bind(hexo);
const js = hexo.extend.helper.get("js").bind(hexo);

hexo.extend.injector.register(
  "head_end",
  () => {
    return css(
      "https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.css",
    );
  },
  "music",
);

hexo.extend.injector.register(
  "body_end",
  '<script src="https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.js">',
  "music",
);

hexo.extend.injector.register("body_end", () => {
  return js("/js/jquery.js");
});

上述设置将把 APlayer.min.css（<link> 标签）注入到任何布局为 music 的页面的 </head>，把 APlayer.min.js（<script> 标签）注入到这些页面的 </body>。此外，jquery.js（<script> 标签）将被注入到生成的每个页面的 </body> 中。

¥Above setup will inject APlayer.min.css (<link> tag) to the </head> of any page which layout is music, and APlayer.min.js (<script> tag) to the </body> of those pages. Also, jquery.js (<script> tag) will be injected to </body> of every page generated.

访问用户配置

¥Accessing user configuration

使用以下任一选项：

¥Use any of the following options:

const css = hexo.extend.helper.get("css").bind(hexo);

hexo.extend.injector.register("head_end", () => {
  const { cssPath } = hexo.config.fooPlugin;
  return css(cssPath);
});
index.js
/* global hexo */

hexo.extend.injector.register("head_end", require("./lib/inject").bind(hexo));
lib/inject.js
module.exports = function () {
  const css = this.extend.helper.get("css");
  const { cssPath } = this.config.fooPlugin;
  return css(cssPath);
};
lib/inject.js
function injectFn() {
  const css = this.extend.helper.get("css");
  const { cssPath } = this.config.fooPlugin;
  return css(cssPath);
}

module.exports = injectFn;
index.js
/* global hexo */

hexo.extend.injector.register("head_end", require("./lib/inject")(hexo));
lib/inject.js
module.exports = (hexo) => () => {
  const css = hexo.extend.helper.get("css").bind(hexo);
  const { cssPath } = hexo.config.fooPlugin;
  return css(cssPath);
};
lib/inject.js
const injectFn = (hexo) => {
  const css = hexo.extend.helper.get("css").bind(hexo);
  const { cssPath } = hexo.config.fooPlugin;
  return css(cssPath);
};

module.exports = (hexo) => injectFn(hexo);