Loading (StaticQuery) white screen on Gatsby

I am getting the error reported on this issue: https://github.com/gatsbyjs/gatsby/issues/25920 But the people from Gatsby seems to be too busy to answer so maybe someone else here knows about this problem.

Have in mind that I am not using the StaticQuery component at all on my code.

I am getting this exact same issue.

I noticed some other devs before having it: https://github.com/gatsbyjs/gatsby/issues/6350

I saw that some devs recommend removing the export from the query variable, so this:

const query = graphql`...`

Instead of this:

export const query = graphql`...`

But this is not my case. Everything was working good until some hours ago.

I have all of my pages with queries like this:

// this is my component
const CollectionProduct = ({ data }) => {...}

// and outside the component is the query
export const query = graphql`
  query($handle: String!) {
    shopifyCollection(handle: { eq: $handle }) {
      products {
        id
        title
        handle
        createdAt
        }
      }
    }
  }
`

In that component I am using export on const query, all of my pages are defined the same way and before there were no problems. I already upgrade and downgrade the version of Gatsby and yet the same issue.

My issues comes exactly after I added a .eslintrc.js config file to the project; is this an option that my project build fails on the live site due to ESLint?

Locally it works, I can build the project and see it on my localhost with no problems. But when I see the live site, it throws that Loading(StaticQuery) white screen. And I am not even using StaticQuery component anywhere. Only the useStaticQuery hook on non page nor templates components.

This is my ESLint config:

module.exports = {
  globals: {
    __PATH_PREFIX__: true,
  },
  'parser': 'babel-eslint',
  parserOptions: {
    extraFileExtensions: ['.js'],    
    sourceType: 'module',
    ecmaFeatures: {
      jsx: true,
    },
    useJSXTextNode: true,
    include: ['**/*js'],
  },
  env: {
    es6: true,
    node: true,
    jest: true,
    browser: true,
    commonjs: true,
    serviceworker: true,
  },
  extends: ['eslint:recommended', 'plugin:react/recommended', 'semistandard', 'plugin:import/react'],
  plugins: ['react'],
  rules: {
    semi: 'off',
    'strict': 0,
    curly: [1, 'all'],
    'no-console': 'error',
    "react/prop-types": 0,
    camelcase: ['off', {}],
    'react/jsx-uses-vars': 1,
    'react/jsx-uses-react': 1,
    'react/jsx-boolean-value': 2,
    "react/display-name": 'warn',
    'react/react-in-jsx-scope': 1,
    'brace-style': ['error', '1tbs'],
    'comma-dangle': ['error', 'never'],
    'linebreak-style': ['error', 'unix'],
    'react-hooks/exhaustive-deps': 'off',
    'standard/no-callback-literal': [0, []],
    'padding-line-between-statements': [
      'error',
      { blankLine: 'always', prev: '*', next: 'return' },
      { blankLine: 'always', prev: '*', next: 'multiline-const' },
      { blankLine: 'always', prev: 'multiline-const', next: '*' },
      { blankLine: 'always', prev: '*', next: 'block-like' },
      { blankLine: 'always', prev: 'block-like', next: '*' },
    ],
    'react/jsx-curly-brace-presence': [
      'error',
      { props: 'never', children: 'never' },
    ],
  },
};

Any ideas?