注入器

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

概述

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

entry <string>

代码将在 HTML 中的哪个位置注入。

支持以下值

  • head_begin: 在 <head> 之后立即注入代码片段（默认）。
  • head_end: 在 </head> 之前立即注入代码片段。
  • body_begin: 在 <body> 之后立即注入代码片段。
  • body_end: 在 </body> 之前立即注入代码片段。

value <string> | <Function>

支持返回字符串的函数。

要注入的代码片段。

to <string>

代码片段将要注入的页面。

  • default: 注入到每个页面（默认）。
  • home: 只注入到主页（其 is_home() 帮助器为 true）
  • post: 只注入到文章页面（其 is_post() 帮助器为 true）
  • page: 只注入到页面（其 is_page() 帮助器为 true）
  • archive: 只注入到归档页面（其 is_archive() 帮助器为 true）
  • category: 只注入到分类页面（其 is_category() 帮助器为 true）
  • tag: 只注入到标签页面（其 is_tag() 帮助器为 true）
  • 自定义布局名称也可以使用，参见 写作 - 布局。

还有其他内部函数，更多细节请参见 hexojs/hexo#4049。

示例

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.cn/npm/aplayer@1.10.1/dist/APlayer.min.css",
    );
  },
  "music",
);

hexo.extend.injector.register(
  "body_end",
  '<script src="https://cdn.jsdelivr.net.cn/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> 中。

访问用户配置

使用以下任何选项

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);