Next 11 并添加 Script 标签不起作用。没有脚本被渲染

时间:2021-06-20 18:17:43

标签: next.js

我将我的 google 标签管理器添加到 _app.js 文件,但它没有显示。我通过新的“脚本”标签加载的脚本都没有工作。

  <Head>
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
    <Script
      src={`https://cdn.somelink.coom/${process.env.COOKIE_KEY}/block.js`}
      strategy="beforeInteractive"
    />
    <Script
      src="https://cdn.somelink.com/scripttemplates/stub.js"
      strategy="beforeInteractive"
    />
    <Script
      src={`https://www.googletagmanager.com/gtag/js?id=${process.env.GOOGLE_KEY}`}
      strategy="afterInteractive"
    />

这些都不起作用。网络选项卡等中没有下载任何内容。页面上没有显示任何内容。有什么想法吗?

提醒:这在 _app.js 文件中。

注意:我的页面是静态生成的。

1 个答案:

答案 0 :(得分:1)

<块引用>

next/script 不应包含在 next/head

参考:Script Component

做这样的事情:

import Script from "next/script";

const App = ({ Component, pageProps }) => (
  <>
    <Script
      src="https://polyfill.io/v3/polyfill.min.js"
      strategy="beforeInteractive"
    />
    {/* eslint-disable-next-line react/jsx-props-no-​spreading */}
    <Component {...pageProps} />
  </>
);

export default App;