Next.js + react-gtm-module ReferenceError: document is not defined

Question

我在我的 Next.js 应用程序中使用这篇文章初始化 GTM：

const tagManagerArgs = {
  gtmId: "GTM-XXXXXX"
};
TagManager.initialize(tagManagerArgs);

但是当我尝试使用它启动应用程序时出现错误：

ReferenceError: document is not defined
    at Object.dataScript (/Users/username/work/projectname/node_modules/react-gtm-module/dist/TagManager.js:11:18)

如何解决？

Answer 1

用检查器包装 TagManager 初始值设定项有助于：

if (process.browser) {
  TagManager.initialize(tagManagerArgs);
}

Answer 2

您可以在网站挂载后立即初始化 TagManager，以确保 DOM api 可用

useEffect(()=>{
    TagManager.initialize({gtmId: 'GTM-XXXXXX'})
},[])

Next.js + react-gtm-module ReferenceError: document is not defined

Next.js + react-gtm-module ReferenceError: document is not defined

reactjs

next.js

react-gtm-module