docusaurus 2：为每个页面运行自定义脚本

问题描述

是否可以为每个页面运行一些自定义脚本？

例如，我要在每个页面上运行alert(1);。我该怎么做而又不冒任何成分？

我知道可以通过创建jsx组件并在每个.mdx文件中使用它来完成此操作（但是每个文档都应该是一个.mdx文件）。所以这不是我想要的东西。

解决方法

Docusaurus 2用户在这里！ ?

Docusaurus是服务器端渲染的，然后被水合以用作单页应用程序。在不了解您要实现的目标的前提下，我只能尝试向您提供一般性建议。

一种实现此目的的方法是创建自己的插件，它使您可以访问执行上下文，例如路由器事件。

我当前在用户更改页面时将其用于分析报告。它尚未记录，但是在docusaurus-plugin-google-analytics软件包的Docusaurus 2存储库中有一个很好的例子。

这是我使用的片段，仅在加载新页面时执行，这完全适合我的用例。当页面充水后，可能还有另一个生命周期挂钩被调用，而我还没有找到。

analytics-module.js

import ExecutionEnvironment from "@docusaurus/ExecutionEnvironment";

export default (function () {
  if (!ExecutionEnvironment.canUseDOM) {
    return null;
  }

  return {
    onRouteUpdate({ location }) {
      _paq.push(["setCustomUrl",location.pathname]);
      _paq.push(["setDocumentTitle",document.title]);
      _paq.push(["trackPageView"]);
    },};
})();