Warnings not always shown

eluchsinger commented 2 years ago

Describe the bug

When running npm start, the output won't show all of the warnings in the project. After editing the files, the warnings start appearing.

(Write your answer here.)

Did you try recovering your dependencies?

NPM Version 6.14.11

Environment

Environment Info:

current version of create-react-app: 5.0.0 running from C:\Users\eluch\AppData\Roaming\npm-cache_npx\3452\node_modules\create-react-app

System: OS: Windows 10 10.0.19043 CPU: (6) x64 Intel(R) Core(TM) i5-9600K CPU @ 3.70GHz
Binaries: Node: 14.16.0 - D:\Program Files\nodejs\node.EXE
Yarn: Not Found npm: 6.14.11 - D:\Program Files\nodejs\npm.CMD Browsers: Chrome: Not Found Edge: Spartan (44.19041.1266.0), Chromium (96.0.1054.62) Internet Explorer: 11.0.19041.1202 npmPackages: react: ^17.0.2 => 17.0.2 react-dom: ^17.0.2 => 17.0.2 react-scripts: 5.0.0 => 5.0.0 npmGlobalPackages: create-react-app: Not Found

Steps to reproduce

(Write your steps here:)

Run npm start
See the console output, doesn't show all of the warnings.
Edit and save a file where you know there should be a warning (e.g. React Hook useEffect has missing dependencies)

Expected behavior

I would expect the warnings (and errors) of the project to be shown.

Actual behavior

Not all of the warnings are shown in the console output.

Reproducible demo

I will try to add a reproducible demo if this is really not a known bug that everyone can reproduce.

hydrandt commented 2 years ago

I have the same problem after upgrading to react-scripts 5. Issues are shown only for files that have just been saved. So, if there are compilation errors, then you kill the app, and start it again, you end up with "No issues found", get errors in browser console, and get errors in cli again when you save the file that contains the code that doesn't conform to eslint configuration.

It seems as the .eslintrc.js config is not parsed when the app starts. If I have an error in the config (such as wrong name of a config), the error is not shown after start, but only after making first change to a watched file and saving.

qq831799 commented 2 years ago

I found this problem might due to the Eslint lintFile and the cache setting(https://eslint.org/docs/developer-guide/nodejs-api#-new-eslintoptions) When use lintFile and turn the cache on. After the first lint, eslint will use the cache result and only lint the file is changed. And the eslint won't clear the cache automatic.

In react-scripts webpack.config.js

new ESLintPlugin({
    // Plugin options
    extensions: ['js', 'mjs', 'jsx', 'ts', 'tsx'],
    formatter: require.resolve('react-dev-utils/eslintFormatter'),
    eslintPath: require.resolve('eslint'),
    failOnError: !(isEnvDevelopment && emitErrorsAsWarnings),
    context: paths.appSrc,
    cache: true,
    cacheLocation: path.resolve(
      paths.appNodeModules,
      '.cache/.eslintcache'
    ),
    // ESLint class options
    cwd: paths.appPath,
    resolvePluginsRelativeTo: __dirname,
    baseConfig: {
      extends: [require.resolve('eslint-config-react-app/base')],
      rules: {
        ...(!hasJsxRuntime && {
          'react/react-in-jsx-scope': 'error',
        }),
      },
    },
  }),

So my workaround solution is before I fix all the eslint waning and error, I will clear the node_modules/.cache manually. But it would take more time at every run.

JamersonAguiarOSF commented 2 years ago

Did anyone find the solution? Same problem here.

kitsunekyo commented 2 years ago

I found this problem might due to the Eslint lintFile and the cache setting(https://eslint.org/docs/developer-guide/nodejs-api#-new-eslintoptions) When use lintFile and turn the cache on. After the first lint, eslint will use the cache result and only lint the file is changed. And the eslint won't clear the cache automatic.

In react-scripts webpack.config.js
new ESLintPlugin({
    // Plugin options
    extensions: ['js', 'mjs', 'jsx', 'ts', 'tsx'],
    formatter: require.resolve('react-dev-utils/eslintFormatter'),
    eslintPath: require.resolve('eslint'),
    failOnError: !(isEnvDevelopment && emitErrorsAsWarnings),
    context: paths.appSrc,
    cache: true,
    cacheLocation: path.resolve(
      paths.appNodeModules,
      '.cache/.eslintcache'
    ),
    // ESLint class options
    cwd: paths.appPath,
    resolvePluginsRelativeTo: __dirname,
    baseConfig: {
      extends: [require.resolve('eslint-config-react-app/base')],
      rules: {
        ...(!hasJsxRuntime && {
          'react/react-in-jsx-scope': 'error',
        }),
      },
    },
  }),
So my workaround solution is before I fix all the eslint waning and error, I will clear the node_modules/.cache manually. But it would take more time at every run.

we have an ejected cra5 app (due to multiple massive issues with cra5), and supply a custom .eslintrc on the root. linting works perfecty with yarn lint but not with yarn start

i just crosschecked with yarn lint and our yarn start only shows a handful of all warnings. after i've run yarn lint the yarn start command doesnt show ANY warnings anymore, even though eslint cache is disabled manually in the webpack config. also the node_modules/.cache/.eslintcache folder is empty

the eslint errors are also not shown when running yarn build, even if there are multiple warnings and errors.

kitsunekyo commented 2 years ago

linking https://github.com/facebook/create-react-app/issues/10509

kitsunekyo commented 2 years ago

here's a reproduction repo: https://github.com/kitsunekyo/cra5-eslint-not-emitting

when i run yarn start i sometimes get correct eslint emits, and sometimes absolutely no eslint output. it appears to be completely random.

if its already running, and i hit save on App.tsx once, the eslint error will correctly show up again.

receter commented 2 years ago

I have the same issue, at some point I don’t see warnings. When I save a file the warnings for this file show up.

Deleting the cache (rm -R ./node_modules/.cache) helps, but as soon as I stop the dev server and restart it I have the same issue again. Currently my workaround is to delete .cache before starting the dev server.

Just deleting ./node_modules/.cache/.eslintcache does not fix the issue.

I am currently on Windows with wsl2, I can later check if I have the same error on my macbook.

This also happens with a fresh CRA 5 default project.

lucapollani commented 2 years ago

Are there some news on the issue? I've encountered the same behavior.

hydrandt commented 2 years ago

Same question here. Is this a dead project / is CRA not recommended way to develop react apps anymore? Or is this not a common scenario to develop?

Last commit to this repo is 29 days ago. 295 open pull requests. Doesn't seem that somebody is actually maintaining this project anymore.

cristianlivella commented 2 years ago

Is there any update here?

It's getting very annoying because I'm often convinced everything is okay, I submit my work to my repository, and I get warnings when I see the continuous deployment build fail.

hydrandt commented 2 years ago

Is this still happening in 5.0.1? Need to check.