我正在使用 gatsby，我使用 netlify 进行部署，但我遇到了 google 字体的问题。我正在使用 Raleway (H1) 和 Open Sans (body)。我尝试在css中导入字体，它在本地工作，而不是在netlify上使用在线版本，我尝试使用“gatsby-plugin-google-font”在本地工作，但不在netlify上工作。我不知道问题出在哪里。你可以在这里查看网站：https://syter.fr 有任何想法吗 ？ 谢谢你:)
【问题讨论】：
标签： gatsby netlify google-fonts
最好的猜测没有看到你的样式代码——它看起来只是一个 CSS 特异性错误，而不是 Gatsby 或 Netlify 特有的任何东西。您可以在您的开发工具“网络”选项卡中验证字体是否正确加载；如果您选择的文本元素之一渲染不正确，您会看到正确的字体（例如“Open Sans”）被一种或多种其他字体所掩盖。在 devtools 中禁用时，您将获得所需的字体：
深入研究您的 index.css 文件，我发现：
font-family 在body 块内多次声明； georgia,serif 的优先级高于 Open Sans 的优先级。
同样，您有一些规则与标题元素的竞争特异性；例如，
h1,h2 {
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;
// ...
}
// [futher down]
.landing h1 {
font-family: Raleway,sans-serif
}
知道这些 CSS 规则是从哪里来的吗？我会从那里开始。
关于为什么您看到在本地与在 Netlify 上运行的结果不同 - 请记住，您在运行 gatsby develop 时看到的结果不等同于将要部署的结果，因为 Gatsby 偷工减料在“开发”模式下启用热重载和诸如此类，并在“构建”模式下对生产性能进行大量优化...... 99％的时间结果是相同的，但偶尔我会遇到它们分歧的边缘情况.您是否尝试过在本地运行gatsby build，然后测试该步骤的静态输出（使用gatsby serve 或只是cd'ing 进入公共目录并启动指向index.html 的HTTP 服务器）？我敢打赌，您可以通过这种方式在本地重现您在 Netlify 中看到的内容，这有助于调试。
a part ça, c'est très bien conçu ?
希望这会有所帮助！
【讨论】：