Gatsby React-Helmet不是服务器端渲染

Question

我正在尝试在服务器端加载我的react-helmet标签，以便在构建时将它们注入到静态html文件中。这样一来，Facebook之类的东西就可以直接获取源文件并使用适当的元标记。

使用此配置应用程序之后，我在服务器端看到的所有静态渲染输出是：

<title data-react-helmet="true"></title>

设定：

gatsby-config.js

module.exports = {
  plugins: ['gatsby-plugin-react-helmet']
}

app.tsx

import Helmet from 'react-helmet';

const Head: React.FunctionComponent<Props> = () => (
  <Helmet title="the title is big" >
    <meta name="description" content="the content" />
  </Helmet >
);

...

gatsby-ssr.js

const {Helmet} = require('react-helmet');

exports.onRenderBody = () => {
  console.log(Helmet.renderStatic())
}

**Output**
<title data-react-helmet="true"></title>

有任何想法吗？

Answer 1

您不需要拥有自己的gatsby-ssr.js文件。使用后gatsby-plugin-react-helmet您就可以开始使用了。你的 Head 组件应该可以正常工作。

您如何看待输出？在浏览器中使用“查看源代码”？您需要查看/public文件夹中的 .html 文件。