Build failed when used `eslint-disable` comments with a missing rule.

[zhengxiaoyao0716]

Describe the bug

When build or start the app, react-scripts would validite the code by eslint, that's great. And sometimes, we may using // eslint-disable-line some-rules to disabled validite for some lines, that's works well too.

However, sometimes, the rule of the eslint-disable comments was missing, for me, it happend when I moved a package out of a monorepo. All the eslint configurations, presets and pulgins ware set by the workspace, not in the package itself.

As the rule was missing, I'll expected the comments has no effect and the package could still works (or maybe we can got a warning), but infact it will interrupt our build and throw an error like Definition for rule 'xxx' was not found . It cause that we have to configured eslint for each package of the monorepo so that we can easlier singled out a child-package to build and test.

Environment

Environment Info:

System:
OS: Windows 10
CPU: x64 Intel(R) Core(TM) i7-7700 CPU @ 3.60GHz
Binaries:
Yarn: 1.13.0 - C:\Users\zheng\AppData\Roaming\npm\yarn.CMD
npm: 6.11.3 - D:\Program Files\nodejs\npm.CMD
Browsers:
Edge: 40.15063.674.0
Internet Explorer: 11.0.15063.850
npmPackages:
react: ^16.8.6 => 16.9.0
react-dom: ^16.8.6 => 16.9.0
react-scripts: 3.1.1 => 3.1.1
npmGlobalPackages:
create-react-app: Not Found

Steps to reproduce

Create a new project and insert a line of comments like this:

// eslint-disable-next-line MISSING_RULE

Then try to build or start the app.

Expected behavior

Maybe we can got a warning, but the project should built succeed as always.

Actual behavior

Just got an error and build failed.

[0x326]

I'm running into a similar issue. In my project, I have a custom .eslintrc.yml file that uses plugins such as @typescript-eslint and unicorn.

Usually, one is able to disable a specific rule via a // eslint-disable-next-line RULE comment. However, should the rule be from a plugin foreign to create-react-app (such as unicorn/no-unsafe-regex), it will give the following error:

Failed to compile.

./src/serviceWorker.ts
  Line 20:  Definition for rule 'unicorn/no-unsafe-regex' was not found  unicorn/no-unsafe-regex

Search for the keywords to learn more about each error.

One solution is to put EXTEND_ESLINT=true into .env. However, this enables many additional rules to be enacted, which tend to be too stringent than necessary for a simple development server. The additional rules are useful for pre-commit and pre-push hooks, but are too strict for live edits, which often serve as a personal scratchpad.

[ianschmitz]

I don't think there's much we can do here. That's an error coming from ESLint that we bubble up to your console. If you think this behavior is incorrect i'd recommend opening an issue on their end.

[0x326]

@ianschmitz What if the user could specify a separate ESlint config file for the build step? What if the user could tell create-react-app to a pass a --config parameter to ESlint (perhaps via a .env file), in the following manner:

.env

ESLINT_CONFIG=user-specified-custom-config.eslintrc.yml

user-specified-custom-config.eslintrc.yml

extends: react-app

parser: '@typescript-eslint/parser'
plugins:
  - '@typescript-eslint'
  - unicorn
  - react-hooks
  # ...