Ignore mini-css-extract-plugin warnings on Gatsby 3

ignore-mini-css-extract-warnings-gatsby.js

/* 

You may be using CSS Modules or another CSS-in-JS library to safely scope CSS between pages and components. 
The webpack mini-css-extract-plugin still warns that the CSS might be bundled out of order.

Warnings look like this:
warn chunk commons [mini-css-extract-plugin]
Conflicting order. Following module has been added:
 * css ./node_modules/gatsby/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[9].oneOf[0].use[1]!./node_modules/gatsby/node_modules/postcss-l
oader/dist/cjs.js??ruleSet[1].rules[9].oneOf[0].use[2]!./node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[9]
.oneOf[0].use[3]!./src/components/Primitive/Container/Container.module.scss

To silence them, add the following code to your gatsby-node.js
*/

/** Removes Mini-css errors */
exports.onCreateWebpackConfig = ({ stage, actions, getConfig }) => {
  if (stage === 'develop' || stage === 'build-javascript') {
    const config = getConfig()
    const miniCssExtractPlugin = config.plugins.find(
      (plugin) => plugin.constructor.name === 'MiniCssExtractPlugin'
    )
    if (miniCssExtractPlugin) {
      miniCssExtractPlugin.options.ignoreOrder = true
    }
    actions.replaceWebpackConfig(config)
  }
}