Failed Building production JavaScript and CSS bundles in CI

Description

This is my first time using gatsby for my projects. On my local machine gatsby successfully built app with 'npm run build' but on CI build failed with error.

npm run build

---> Running in b9c5e6c80cb0

> portal-frontend-loans@0.1.0 build /app
> gatsby build --prefix-paths

╔════════════════════════════════════════════════════════════════════════╗
║                                                                        ║
║   Gatsby collects anonymous usage analytics                            ║
║   to help improve Gatsby for all users.                                ║
║                                                                        ║
║   If you'd like to opt-out, you can use `gatsby telemetry --disable`   ║
║   To learn more, checkout https://gatsby.dev/telemetry                 ║
║                                                                        ║
╚════════════════════════════════════════════════════════════════════════╝

success open and validate gatsby-configs - 0.006s
success load plugins - 0.040s
success onPreInit - 0.004s
success delete html and css files from previous builds - 0.014s
success initialize cache - 0.008s
success copy gatsby files - 0.035s
success onPreBootstrap - 0.013s
success createSchemaCustomization - 0.004s
success source and transform nodes - 0.018s
success building schema - 0.190s
success createPages - 0.001s
success createPagesStatefully - 0.017s
success onPreExtractQueries - 0.001s
success update schema - 0.022s
success extract queries from components - 0.255s
success write out requires - 0.005s
success write out redirect data - 0.002s
success onPostBootstrap - 0.001s

info bootstrap finished - 3.027 s

failed Building production JavaScript and CSS bundles - 0.160s

ERROR #98123  WEBPACK

Generating JavaScript bundles failed

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.optimization.splitChunks.cacheGroups['commons'].minChunks should be >= 1.
 -> Minimum number of times a module has to be duplicated until it's considered for splitting

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! portal-frontend-loans@0.1.0 build: `gatsby build --prefix-paths`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the portal-frontend-loans@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2020-04-08T16_01_21_703Z-debug.log
The command '/bin/sh -c npm run build' returned a non-zero code: 1

Steps to reproduce

run npm run build or gatsby build --prefix-paths

Expected result

Successful build in CI

Actual result

Build failed

Environment

on local machine

gatsby info --clipboard

  System:
    OS: macOS 10.15.4
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 13.12.0 - /usr/local/bin/node
    Yarn: 1.19.1 - /usr/local/bin/yarn
    npm: 6.14.4 - /usr/local/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 80.0.3987.163
    Safari: 13.1
  npmPackages:
    gatsby: ^2.20.8 => 2.20.13
    gatsby-alias-imports: ^1.0.4 => 1.0.4
    gatsby-cli: ^2.11.5 => 2.11.5
    gatsby-link: ^2.3.2 => 2.3.2
    gatsby-plugin-google-tagmanager: ^2.2.1 => 2.2.1
    gatsby-plugin-linaria: ^2.0.0 => 2.0.0
    gatsby-plugin-react-helmet: ^3.2.1 => 3.2.1
    gatsby-plugin-styled-components: ^3.2.1 => 3.2.1
    gatsby-source-filesystem: ^2.2.2 => 2.2.2
    gatsby-transformer-json: ^2.3.1 => 2.3.1

on CI

gatsby info --clipboard

   System:
      OS: Linux 4.4 Debian GNU/Linux 9 (stretch) 9 (stretch)
      CPU: (4) x64 Intel(R) Xeon(R) CPU E5-2660 v3 @ 2.60GHz
      Shell: 4.4.12 - /bin/bash
    Binaries:
      Node: 12.16.1 - /usr/local/bin/node
      Yarn: 1.22.0 - /usr/local/bin/yarn
      npm: 6.13.4 - /usr/local/bin/npm
    Languages:
      Python: 2.7.13 - /usr/bin/python
    npmPackages:
      gatsby: ^2.20.8 => 2.20.13
      gatsby-alias-imports: ^1.0.4 => 1.0.4
      gatsby-cli: ^2.11.5 => 2.11.5
      gatsby-link: ^2.3.2 => 2.3.2
      gatsby-plugin-google-tagmanager: ^2.2.1 => 2.2.1
      gatsby-plugin-linaria: ^2.0.0 => 2.0.0
      gatsby-plugin-react-helmet: ^3.2.1 => 3.2.1
      gatsby-plugin-styled-components: ^3.2.1 => 3.2.1
      gatsby-source-filesystem: ^2.2.2 => 2.2.2
      gatsby-transformer-json: ^2.3.1 => 2.3.1

gatsby-config.js

const { createProxyMiddleware } = require('http-proxy-middleware')

module.exports = {
  assetPrefix: `/${process.env.npm_package_name}`,
  plugins: [
    'gatsby-plugin-styled-components',
    'gatsby-transformer-json',
    'gatsby-plugin-react-helmet',
    {
      resolve: 'gatsby-alias-imports',
      options: {
        aliases: {
          api: 'src/api',
          components: 'src/components',
          templates: 'src/templates',
          // TODO перенести в GraphQL
          mocks: 'src/mocks',
          // TODO Отрефачить в TypeScript
          utils: 'src/utils'
        }
      }
    },
    {
      resolve: 'gatsby-source-filesystem',
      options: {
        path: `./src/data/`,
      },
    },
    {
      resolve: 'gatsby-plugin-google-tagmanager',
      options: {
        id: 'GTM-XXXXXXXX',
        includeInDevelopment: false,
        defaultDataLayer: { platform: 'gatsby' },
      },
    },
  ],
  developMiddleware: app => {
    app.use(
      '/ump-api',
      createProxyMiddleware({
        target: '/',
        changeOrigin: true,
        router: {
          '/ump-api': 'http://services-ump2-dev.mbrd.ru:8090',
        },
        pathRewrite: {
          '^/ump-api/': '',
        },
        logLevel: 'debug',
      }),
    )
  },
}

gatsby-node.js

exports.createPages = ({ actions }) => {
  const { createRedirect } = actions

  const homePath = '/'

  const redirectBatch = [
    { from: '/chastnim-licam', to: homePath },
    { from: '/chastnim-licam/', to: homePath },
  ]

  redirectBatch.forEach(({ from, to }) => {
    if (to === '') {
      t = homePath
    }
    createRedirect({
      fromPath: from,
      redirectInBrowser: true,
      toPath: to,
    })
  })
}

exports.onCreatePage = async ({ page, actions }) => {
  const { createPage } = actions
  if (page.path.match(/^\/chastnim-licam\/krediti\/kredit-na-lyubye-celi/)) {
    page.matchPath = "/chastnim-licam/krediti/kredit-na-lyubye-celi/*"
  }
  if (page.path.match(/^\/chastnim-licam\/krediti\/kredit-na-tovary/)) {
    page.matchPath = "/chastnim-licam/krediti/kredit-na-tovary/*"
  }
  if (page.path.match(/^\/chastnim-licam\/krediti\/refinans/)) {
    page.matchPath = "/chastnim-licam/krediti/refinans/*"
  }
  createPage(page)
}

gatsby-browser.js

exports.onRouteUpdate = ({ location }) => scrollToAnchor(location)

function scrollToAnchor(location) {
  if (!location || !location.hash) return

  const itemOffsetTop = document.querySelector(`${location.hash}`).offsetTop

  window.scrollTo({
    top: itemOffsetTop,
  })
}

package.json

{
  "name": "portal-frontend-loans",
  "private": true,
  "description": "Приложение «Кредиты»",
  "version": "0.1.0",
  "license": "MIT",
  "scripts": {
    "build": "gatsby build --prefix-paths",
    "develop": "gatsby develop",
    "format": "prettier --write \"**/*.{js,jsx,json,md}\"",
    "start": "npm run develop",
    "serve": "gatsby serve --prefix-paths",
    "clean": "gatsby clean",
    "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1"
  },
  "dependencies": {
    "@mtsbank/common": "^5.9.7",
    "@mtsbank/ui-kit": "^6.7.2",
    "gatsby": "^2.20.8",
    "gatsby-alias-imports": "^1.0.4",
    "gatsby-link": "^2.3.2",
    "gatsby-plugin-google-tagmanager": "^2.2.1",
    "gatsby-plugin-linaria": "^2.0.0",
    "gatsby-plugin-react-helmet": "^3.2.1",
    "gatsby-plugin-styled-components": "^3.2.1",
    "gatsby-source-filesystem": "^2.2.2",
    "gatsby-transformer-json": "^2.3.1",
    "isomorphic-fetch": "^2.2.1",
    "nanoid": "^3.0.2",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-helmet": "^5.2.1",
    "styled-components": "^5.0.1"
  },
  "devDependencies": {
    "babel-eslint": "^10.0.3",
    "babel-plugin-styled-components": "^1.10.7",
    "babel-preset-gatsby": "^0.3.1",
    "gatsby-cli": "^2.11.5",
    "eslint": "^6.8.0",
    "eslint-config-airbnb": "^18.0.1",
    "eslint-config-prettier": "^4.1.0",
    "eslint-loader": "^3.0.3",
    "eslint-plugin-import": "^2.19.1",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-mdx": "^1.6.8",
    "eslint-plugin-prettier": "^3.1.2",
    "eslint-plugin-react": "^7.17.0",
    "eslint-plugin-react-hooks": "^1.7.0",
    "http-proxy-middleware": "^1.0.3",
    "prettier": "^1.19.1",
    "prop-types": "^15.7.2",
    "stylelint": "^13.0.0",
    "stylelint-config-prettier": "^8.0.1",
    "stylelint-config-rational-order": "^0.1.2",
    "stylelint-order": "^3.1.1"
  }
}

gatsbyjs / gatsby

Failed Building production JavaScript and CSS bundles in CI #22939