fix(eslint-config): set parser, don't fail the build on minimal eslint-loader errors

[pieh]

Description

#29109 was not sufficent. This also specify parser (by default it uses https://github.com/eslint/espree - but it seems like version we/eslint (also version of eslint we use) doesn't support optional chaining ?. - used version is espree@^6, and according to https://github.com/eslint/espree/blob/master/CHANGELOG.md support was added in espree@^7).

Other part is emitWarning: true, which should prevent errors coming from eslint-loader from blocking users - per https://github.com/webpack-contrib/eslint-loader#noemitonerrorsplugin

NoEmitOnErrorsPlugin is now automatically enabled in webpack 4, when mode is either unset, or set to production. So even ESLint warnings will fail the build. No matter what error settings are used for eslint-loader, except if emitWarning enabled.

Current:

With emitWarning: true - so it still is confusing, and we need to fix those, but at least it doesn't prevent webpack from compiling (or rather emitting I guess):

It prooved to be whack'a'mole with this minimal eslint config for fast-refresh rules, so there are few things to consider here:

• maybe we should disable it (for now)?
• lack of tests for this code path doesn't inspire confidence

Related Issues

#29105 (comment)

Fixes #29133

[theskillwithin]

I am experiencing this as well as long with Parsing error: Unexpected token = on old class components

[mikaelkristiansson]

what is the progress of this?

[wardpeet]

Shouldn't we add it to the package.json?

[pieh]

we already have it -

gatsby/packages/gatsby/package.json

Line 34 in 7b6454b

"babel-eslint": "^10.1.0",

[theskillwithin]

for ecmaVersion I set to 2020. any reason why its 2018 here?

  parserOptions: {
    ecmaVersion: 2020,
    sourceType: 'module',
    ecmaFeatures: {
      jsx: true,
    },
  },

[vladar]

I don't think it fixes issue #29133

The problem is that we add our required config here:

gatsby/packages/gatsby/src/utils/webpack.config.js

Lines 737 to 743 in 7b6454b

	if (
	stage === `develop` &&
	process.env.GATSBY_HOT_LOADER === `fast-refresh` &&
	hasLocalEslint(program.directory)
	) {
	finalConfig = ensureRequireEslintRules(finalConfig)
	}

But after #29109 this required config has useEslintrc: false. So we effectively disable eslintrc with our new settings, i.e. even if the file exists, the loader ignores it with our config.

So to recap - this PR indeed fixes the problem with parser but not the eslintrc part.

As for me, it sounds like the only good way to fix this is to have two eslint loaders - one for normal eslint setup - and another one - for specific fast-refresh rules. That separate loader can have any config, e.g. we can safely disable eslintrc and inline comments for it.

[pieh]

Closing this in favour of #29317 which is more robust