Importing SCSS into cms module breaks only during live netlify deploy (gatsby-plugin-netlify-cms)

When I import scss into my custom cms module for gatsby-plugin-netlify-cms everything works fine locally for gatsby serve (localhost:9000) and gatsby develop (localhost:8000), however when I deploy to the netlify host I get the following error in my build log:

4:31:08 PM: success onPostBootstrap - 0.286s
4:31:08 PM: ⠀
4:31:08 PM: info bootstrap finished - 7.609 s
4:31:08 PM: ⠀
4:31:15 PM: error UNHANDLED EXCEPTION Callback was already called.
4:31:15 PM: 
4:31:15 PM:   Error: Callback was already called.
4:31:15 PM:   
4:31:15 PM:   - async.js:16 throwError
4:31:15 PM:     [repo]/[neo-async]/async.js:16:11
4:31:15 PM:   
4:31:15 PM:   - async.js:2818 
4:31:15 PM:     [repo]/[neo-async]/async.js:2818:7
4:31:15 PM:   
4:31:15 PM:   - next_tick.js:61 process._tickCallback
4:31:15 PM:     internal/process/next_tick.js:61:11
4:31:15 PM:   
4:31:15 PM: 
4:31:15 PM: not finished run queries - 6.932s

The contents of the offending file ./src/cms/custom-netlify.js Please note that when the import scss statement is commented out the build error goes away. Also replacing the offending line of code with CMS.registerPreviewStyle('../../content/assets/style/main.scss')' works locally and doesnt break the build on netlify, however the styles dont show up in production. In all cases the script tag for the styles is in the rendered html: <link href="../../content/assets/style/main.scss" type="text/css" rel="stylesheet">`

/* eslint-disable */
import CMS from 'netlify-cms-app'
import config from './config-netlify'
import "../../content/assets/style/main.scss" 

CMS.init(config)

The relavant portion of my gatsby-config.js

plugins: [
    {
      // this entry has to be the first or will not work as per FAQ 
      resolve:`gatsby-source-filesystem`, 
      options:{
        path:`${__dirname}/static/assets`,
        name:`assets`
      }
    },
    `gatsby-plugin-remove-fingerprints`,
     /* gatsby-plugin-frontmatter-markdown-loader must come before gatsby-plugin-netlify-cms 
        since we use it in a gatsby-plugin-netlify-cms module. See the comments in gatsby-node.js
        in the local /plugins folder for more information.
     */
    `gatsby-plugin-frontmatter-markdown-loader`,
    `gatsby-plugin-sass`,
    {
      resolve: `gatsby-plugin-netlify-cms`,
      options: {
        manualInit: true,
        modulePath: `${__dirname}/src/cms/custom-netlify.js`
      }
    },
    `gatsby-plugin-styled-components`,
    `gatsby-transformer-sharp`,
    `gatsby-plugin-sharp`,
    `gatsby-plugin-offline`,
    `gatsby-plugin-react-helmet`,
    `gatsby-plugin-feed-mdx`,
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        path: `${__dirname}/content/blog`,
        name: `blog`,
      },
    },
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        path: `${__dirname}/content/data/pages`,
        name: `page data`,
      },
    },
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        path: `${__dirname}/content/data/cms_ui`,
        name: `cms ui data`,
      },
    },
    {
      resolve: `gatsby-plugin-mdx`,
      options: {
        extensions: [".mdx", ".md"],
        defaultLayouts: {
          default: require.resolve("./src/templates/mdx/default.js")
        },
        gatsbyRemarkPlugins: [
          {
            resolve: `gatsby-remark-images`,
            options: {
              maxWidth: 590,
            },
          },
          {
            resolve: "gatsby-remark-external-links",
            options: {
              target: "_blank",
              rel: "nofollow noreferrer"
            }
          },
          {
            resolve: `gatsby-remark-responsive-iframe`,
            options: {
              wrapperStyle: `margin-bottom: 1.0725rem`,
            },
          },
          {
            resolve: `gatsby-remark-vscode`,
          },
          {
            resolve: `gatsby-remark-copy-linked-files`,
          },
          {
            resolve: `gatsby-remark-smartypants`,
          },
        ],
      },
    },
    {
      resolve: `gatsby-plugin-google-analytics`,
      options: {
        // edit below
        // trackingId: `ADD YOUR TRACKING ID HERE`,
      },
    },
  ],

My relavant portion of my package.json

{
  "dependencies": {
    "@mdx-js/mdx": "^1.5.7",
    "@mdx-js/react": "^1.5.7",
    "babel-plugin-styled-components": "^1.10.7",
    "bulma": "^0.8.0",
    "frontmatter-markdown-loader": "^3.2.1",
    "gatsby": "^2.19.43",
    "gatsby-image": "^2.0.39",
    "gatsby-plugin-feed-mdx": "^1.0.0",
    "gatsby-plugin-google-analytics": "^2.0.18",
    "gatsby-plugin-manifest": "^2.2.47",
    "gatsby-plugin-mdx": "^1.0.82",
    "gatsby-plugin-netlify-cms": "^4.0.0",
    "gatsby-plugin-offline": "^3.0.40",
    "gatsby-plugin-react-helmet": "^3.0.12",
    "gatsby-plugin-remove-fingerprints": "^0.0.2",
    "gatsby-plugin-sass": "^2.1.30",
    "gatsby-plugin-sharp": "^2.4.12",
    "gatsby-plugin-styled-components": "^3.1.20",
    "gatsby-plugin-typography": "^2.2.13",
    "gatsby-remark-copy-linked-files": "^2.0.11",
    "gatsby-remark-external-links": "^0.0.4",
    "gatsby-remark-images": "^3.1.49",
    "gatsby-remark-responsive-iframe": "^2.1.1",
    "gatsby-remark-smartypants": "^2.0.9",
    "gatsby-remark-vscode": "^2.0.3",
    "gatsby-source-filesystem": "^2.1.55",
    "gatsby-transformer-sharp": "^2.3.18",
    "netlify-cms-app": "^2.11.29",
    "node-sass": "^4.13.1",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-helmet": "^5.2.0",
    "react-switch": "^5.0.0",
    "react-typography": "^0.16.19",
    "styled-components": "^5.0.1",
    "typeface-merriweather": "0.0.72",
    "typeface-montserrat": "0.0.75",
    "typography": "^0.16.19",
    "typography-theme-wordpress-2016": "^0.16.19"
  },
  "devDependencies": {
    "@babel/register": "^7.8.6",
    "better-docs": "^1.4.7",
    "jsdoc": "^3.6.3",
    "prettier": "^1.19.0"
  }
}

System info

  System:
    OS: Windows 10 10.0.18362
    CPU: (8) x64 Intel(R) Core(TM) i7-6700HQ CPU @ 2.60GHz
  Binaries:
    Node: 12.4.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.19.1 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 6.13.2 - C:\Program Files\nodejs\npm.CMD
  Languages:
    Python: 2.7.16 - /c/Python27/python
  Browsers:
    Edge: 44.18362.449.0
  npmPackages:
    gatsby: ^2.19.43 => 2.19.43 
    gatsby-image: ^2.0.39 => 2.2.43 
    gatsby-plugin-feed-mdx: ^1.0.0 => 1.0.1 
    gatsby-plugin-google-analytics: ^2.0.18 => 2.1.37 
    gatsby-plugin-manifest: ^2.2.47 => 2.2.47 
    gatsby-plugin-mdx: ^1.0.82 => 1.0.82 
    gatsby-plugin-netlify-cms: ^4.0.0 => 4.1.41 
    gatsby-plugin-offline: ^3.0.40 => 3.0.40 
    gatsby-plugin-react-helmet: ^3.0.12 => 3.1.23 
    gatsby-plugin-remove-fingerprints: ^0.0.2 => 0.0.2 
    gatsby-plugin-sass: ^2.1.30 => 2.1.30 
    gatsby-plugin-sharp: ^2.4.12 => 2.4.12 
    gatsby-plugin-styled-components: ^3.1.20 => 3.1.20 
    gatsby-plugin-typography: ^2.2.13 => 2.3.24 
    gatsby-remark-copy-linked-files: ^2.0.11 => 2.1.39 
    gatsby-remark-external-links: ^0.0.4 => 0.0.4 
    gatsby-remark-images: ^3.1.49 => 3.1.49 
    gatsby-remark-responsive-iframe: ^2.1.1 => 2.2.33 
    gatsby-remark-smartypants: ^2.0.9 => 2.1.22 
    gatsby-remark-vscode: ^2.0.3 => 2.0.3 
    gatsby-source-filesystem: ^2.1.55 => 2.1.55 
    gatsby-transformer-sharp: ^2.3.18 => 2.3.18 

I think I need to tell webpack how to bundle the scss but I am unsure how. main.scss fails to load in all cases but somehow locally the styles from main.scss make it the preview pane.

[laurieontech]

@donaldboulton Your comment includes personal attacks which are against our Code of Conduct. We reserve the right to remove your access to the repo if continue to engage in such behavior. We aim to be an inclusive and friendly open source project. Please consider this as an initial warning and act accordingly. I have deleted the comment.

[apolopena]

@erezrokah Yeah I guess in my case and possibly other cases, the Netlify live deployment process in the docker container does something different and or redundant with the webpack loaders when bundling so those loaders had to be disabled in the custom cms.js using the webpack inline ! prefix syntax.