如何在 NEXTJS 中添加脚本标签？答案

【问题标题】：How to add a script tag in NEXTJS?如何在 NEXTJS 中添加脚本标签？
【发布时间】：2022-01-21 01:37:46
【问题描述】：

我正在尝试将 sumome 添加到我的下一个应用程序中。

他们提供了这个代码

 <script async>(function(s,u,m,o,j,v){j=u.createElement(m);v=u.getElementsByTagName(m)[0];j.async=1;j.src=o;j.dataset.sumoSiteId='xxxxxxxxxxxxxxxxxxxxxxxxxxx';v.parentNode.insertBefore(j,v)})(window,document,'script','//load.sumo.com/');</script>

我知道 next 有自己的脚本标签，但我无法使用它正确设置它。所以，我在这里需要一些帮助。谢谢。

【问题讨论】：

这能回答你的问题吗？ Next.js Loads <script> tags but it doesn't execute them

标签： async-await next.js script sumo

【解决方案1】：

从next/script 导入Script

并像这样使用它：

import Script from 'next/script'

...

<Script
  strategy="afterInteractive"
  dangerouslySetInnerHTML={{
    __html: `
    (function(s,u,m,o,j,v){j=u.createElement(m);v=u.getElementsByTagName(m)[0];j.async=1;j.src=o;j.dataset.sumoSiteId='xxxxxxxxxxxxxxxxxxxxxxxxxxx';v.parentNode.insertBefore(j,v)})(window,document,'script','//load.sumo.com/');
  `,
  }}
/>

【讨论】：