Getting started with Gatsby - when I add a link tag to public/index.html with the google font it works in development mode. When I build the site the index.html gets reset. So I guess there is another proper way to add the font?
You can also use react-helmet, which is discussed in the gatsby tutorial.
Include a google fonts link element within the helmet component.
Like this:
<Helmet>
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"/>
</Helmet>
I ended up going down this route because I had already done some styling manually, and when I tried using Typography it made a bunch of changes that would have taken me a while to undo.