title: Gatsby Issue - on load and on refresh I am seeing a flicker of unstyled components
body: <p>Issue - When I first load the page or I refresh the page, I get a flash of ugly un-styled features such as massive images, links go back to the custom styling of blue text with an underline, etc) before my own CSS applies.</p>
  <p>Here is my package.json file -</p>
  <pre><code>{
    &quot;name&quot;: &quot;gatsby-starter-hello-world&quot;,
    &quot;private&quot;: true,
    &quot;description&quot;: &quot;A simplified bare-bones starter for Gatsby&quot;,
    &quot;version&quot;: &quot;0.1.0&quot;,
    &quot;license&quot;: &quot;0BSD&quot;,
    &quot;scripts&quot;: {
      &quot;build&quot;: &quot;gatsby build&quot;,
      &quot;develop&quot;: &quot;gatsby develop&quot;,
      &quot;format&quot;: &quot;prettier --write \&quot;**/*.{js,jsx,ts,tsx,json,md}\&quot;&quot;,
      &quot;start&quot;: &quot;npm run develop&quot;,
      &quot;serve&quot;: &quot;gatsby serve&quot;,
      &quot;clean&quot;: &quot;gatsby clean&quot;,
      &quot;test&quot;: &quot;echo \&quot;Write tests! -&gt; https://gatsby.dev/unit-testing\&quot; &amp;&amp; exit 1&quot;
    },
    &quot;dependencies&quot;: {
      &quot;@mdx-js/mdx&quot;: &quot;^1.6.22&quot;,
      &quot;@mdx-js/react&quot;: &quot;^1.6.22&quot;,
      &quot;babel-plugin-styled-components&quot;: &quot;^1.12.0&quot;,
      &quot;gatsby&quot;: &quot;^2.26.1&quot;,
      &quot;gatsby-image&quot;: &quot;^2.7.0&quot;,
      &quot;gatsby-plugin-google-fonts&quot;: &quot;^1.0.1&quot;,
      &quot;gatsby-plugin-manifest&quot;: &quot;^2.9.0&quot;,
      &quot;gatsby-plugin-mdx&quot;: &quot;^1.5.0&quot;,
      &quot;gatsby-plugin-sharp&quot;: &quot;^2.9.1&quot;,
      &quot;gatsby-plugin-styled-components&quot;: &quot;^3.5.0&quot;,
      &quot;gatsby-remark-images&quot;: &quot;^3.6.0&quot;,
      &quot;gatsby-source-filesystem&quot;: &quot;^2.6.1&quot;,
      &quot;gatsby-transformer-sharp&quot;: &quot;^2.7.0&quot;,
      &quot;react&quot;: &quot;^16.12.0&quot;,
      &quot;react-dom&quot;: &quot;^16.12.0&quot;,
      &quot;react-helmet&quot;: &quot;^6.1.0&quot;,
      &quot;styled-components&quot;: &quot;^5.2.1&quot;
    },
    &quot;devDependencies&quot;: {
      &quot;prettier&quot;: &quot;2.1.2&quot;
    },
    &quot;repository&quot;: {
      &quot;type&quot;: &quot;git&quot;,
      &quot;url&quot;: &quot;https://github.com/gatsbyjs/gatsby-starter-hello-world&quot;
    },
    &quot;bugs&quot;: {
      &quot;url&quot;: &quot;https://github.com/gatsbyjs/gatsby/issues&quot;
    }
  }
  </code></pre>
  <p>Here is my gatsby-config file -</p>
  <pre><code>module.exports = {
    siteMetadata: {
      title: &quot;Gatsby Project&quot;,
      description: &quot;&quot;,
      image: &quot;/logo.png&quot;,
    },
    plugins: [
      {
        resolve: `gatsby-source-filesystem`,
        options: {
          name: `pages`,
          path: `${__dirname}/src/pages`,
        },
      },
      {
        resolve: `gatsby-plugin-styled-components`,
      },
      {
        resolve: `gatsby-source-filesystem`,
        options: {
          name: `posts`,
          path: `${__dirname}/src/posts`,
        },
      },
      {
        resolve: `gatsby-source-filesystem`,
        options: {
          name: `images`,
          path: `${__dirname}/src/images`,
        },
      },
      `gatsby-plugin-sharp`,
      `gatsby-transformer-sharp`,
      {
        resolve: `gatsby-plugin-mdx`,
        options: {
          extensions: [`.mdx`, `.md`],
          gatsbyRemarkPlugins: [
            {
              resolve: `gatsby-remark-images`,
              options: { maxWidth: 1200 },
            },
          ],
        },
      },
      {
        resolve: `gatsby-plugin-google-fonts`,
        options: {
          fonts: [`roboto-mono`, `muli\:400,400i,700,700i`],
          display: &quot;swap&quot;,
        },
      },
      {
        resolve: `gatsby-plugin-manifest`,
        options: {
          icon: `src/images/logo.png`,
        },
      },
    ],
  }
  </code></pre>
  <p>Am I missing a dependancy or is there a mistake in my config? Not sure..</p>
  <p>Any suggestions would be much appreciated!</p>