Develop vs Build Styling very different [v 2.13.8 / 2.11.3 (cli) ]

Description

difference between the develop and build static sites. both commands are working. the styling is quite different. the develop site works as expected. the build site has the the css inline in the head tag but outside of any other tag. just appears as rendered text in the browser.

Steps to reproduce

1. gatsby develop

2. view site

3. gatsby build

4. view site

both commands execute successfully

Expected result

sites should be virtually identical between develop and build

Actual result

the styling is quite different. the develop site works as expected. the build site has the the css inline in the head tag but outside of any other tag. just appears as rendered text in the browser.

Environment

Run gatsby info --clipboard in your project directory and paste the output here.

 System:
    OS: Linux 4.15 Ubuntu 18.04.2 LTS (Bionic Beaver)
    CPU: (1) x64 Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz
    Shell: 4.4.19 - /bin/bash
  Binaries:
    Node: 12.0.0 - ~/.nvm/versions/node/v12.0.0/bin/node
    Yarn: 1.22.4 - ~/.nvm/versions/node/v12.0.0/bin/yarn
    npm: 6.14.4 - ~/.nvm/versions/node/v12.0.0/bin/npm
  Languages:
    Python: 2.7.15+ - /usr/bin/python
  npmPackages:
    gatsby: ^2.7.5 => 2.13.8
    gatsby-image: ^2.3.1 => 2.3.1
    gatsby-plugin-graphql-codegen: ^2.6.1 => 2.6.1
    gatsby-plugin-react-helmet: ^3.1.2 => 3.1.2
    gatsby-plugin-sass: ^2.1.3 => 2.1.3
    gatsby-plugin-sharp: ^2.5.3 => 2.5.3
    gatsby-plugin-typescript: ^2.3.1 => 2.3.1
    gatsby-source-filesystem: ^2.1.5 => 2.1.5
    gatsby-transformer-remark: ^2.6.7 => 2.6.7
    gatsby-transformer-sharp: ^2.4.3 => 2.4.3
  npmGlobalPackages:
    gatsby-cli: 2.11.3

gatsby.config.js

module.exports = {
  /* Your site config here */
  siteMetadata: {
    title: `Environment Awareness Tracker (EAT)`,
    description:
      "Lorem ipsum ... .",
    url: "https://www.mcr.com", // No trailing slash allowed!
    image: "sheild.svg", // Path to your image you placed in the 'static' folder
  },
  plugins: [
    `gatsby-transformer-sharp`,
    `gatsby-plugin-sharp`,
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        path: `${__dirname}/src/assets/`,
      },
    },
    `gatsby-plugin-react-helmet`,
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `src`,
        path: `${__dirname}/src/`,
      },
    },
    `gatsby-transformer-remark`,
    `gatsby-plugin-sass`,
    `gatsby-plugin-typescript`,

    {
      resolve: `gatsby-plugin-graphql-codegen`,
      options: {
        key: 'gatsby',
        documentPaths: [
          './src/**/*.{ts,tsx}',
          './node_modules/gatsby-*/**/*.js',
        ],
        codegenDelay: 200,
        fileName: `types/graphql-types-gatsby.ts`


      }
    }
  ]
}

additional info:

• using sass to imprt stylesheets
• react components using sass and css modules

[fiftymissioncap]

ok. thanks. i’ll go with the synchronous link or change the css library.

thanks for your help and quick assistance. i thought it was a something i was doing wrong or a gatsby issue (which it still may be) but i’ve got a work around now.

if you think this is not a major issue feel free to close it or keep it open (or merge it with another issue) if you think it needs to be handled by gatsby.

[github-actions[bot]]

Hey again!

It’s been 30 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it. Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to reopen this issue or create a new one if you need anything else. As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks again for being part of the Gatsby community! 💪💜