如何在 gatsby 的 HEAD 中放置第三方脚本标签

【问题标题】：How to place a third party script tag in the HEAD in gatsby如何在 gatsby 的 HEAD 中放置第三方脚本标签
【发布时间】：2018-06-17 20:52:34
【问题描述】：

Gatsby 提供了一种方法来操作主要的 html.js link to gatsby docs

但这仍然是一个 React 组件，我需要在 Head 中放置一个自定义分析脚本。我尝试了eval，将脚本内容括在大括号中，没有任何效果。

【问题讨论】：

标签： reactjs gatsby

【解决方案1】：

找到了使用 dangerouslySetInnerHTML 的解决方法。因为它会剥离我们的脚本标签，所以我只是在 Head 中放置了一个脚本标签，并将 attr dangerouslySetInnerHTML 设置为第三方提供的脚本内容。例如在 html.js 的渲染函数中：

 const googleOptimizeFlickeringScript = {
  __html: `(function(a,s,y,n,c,h,i,d,e){..........`
}
return (
  <html>
    <head>
      <style dangerouslySetInnerHTML={googleOptimizeFlickeringStyle} />
      <script dangerouslySetInnerHTML={googleOptimizeFlickeringScript}/>

【讨论】：