我是React,GraphQL和Gatsby的新手。我跟着教程,并不能完全弄清楚<link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet">
标签应该去哪里...
这是我的layout.js文件......
import React from 'react'
import PropTypes from 'prop-types'
import Helmet from 'react-helmet'
import {StaticQuery, graphql} from 'gatsby'
import Header from './header'
import './css/style.css'
import Footer from './footer'
const Layout = ({ children }) => (
<StaticQuery
query={graphql`
query SiteTitleQuery {
site {
siteMetadata {
title
description
keywords
}
}
allContentfulLink (sort: { fields: [createdAt], order: ASC }) {
edges {
node {
title
url
createdAt
}
}
}
}
`}
render={data => (
<>
<Helmet
title={data.site.siteMetadata.title}
meta={[
{ name: 'description', content: data.site.siteMetadata.description },
{ name: 'keywords', content: data.site.siteMetadata.keywords },
]}
>
<html lang="en" />
</Helmet>
<Header siteTitle={data.site.siteMetadata.title}/>
{children}
<Footer data={data}>
</Footer>
</>
)}
/>
)
Layout.propTypes = {
children: PropTypes.node.isRequired,
}
export default Layout
我试图添加头盔,打开标签并插入其中,两者都收到错误。
我不确定我做错了什么。
非常感谢任何帮助!!
最简单的方法是将gatsby-plugin-web-font-loader
添加到package.json
,然后在gatsby-config.js
中配置插件:
{
plugins: [
{
resolve: 'gatsby-plugin-web-font-loader',
options: {
google: {
families: ['Nunito']
}
}
}
]
}