Настройте Pendo в Next.js

Question

В нашем проекте мы используем Next.js 12 с SSR. Я прочитал документацию Pendo, но до сих пор не уверен, где разместить фрагмент установки в нашем коде, поскольку Next.js не предоставляет файл index.html. Однако мы используем макеты. Является ли верхняя часть макета подходящим местом для размещения Pendo?

Я пытался поместить фрагмент как функцию внутри возврата компонента макета, но, по-видимому, он не работает так.

Спасибо за любую помощь!

Answer 1

Твой_app.tsxследует начать с чего-то вроде этого, и это сработает:

      function MyApp({ Component, pageProps }: AppProps) {
  return (
    <>
      {/* Pendo Offsite MPA setup code snippet */}
      <script
        dangerouslySetInnerHTML={{
          __html: `
            (function(apiKey){
              ...
              ...
              });
            });`,
        }}
      />

      <sometag />
    </>
  );
}

Вставьте свой код скрипта Pendo как есть в местозаполнитель выше в качестве блока комментариев.

The _app.jsфайл работает какindex.js, точка входа для всего приложения, включая каждую его подстраницу.