nzakas
commented
2 weeks ago I'm having a bit of a hard time following what you're trying to do and understanding wear the interaction between ESLint and Webpack overlaps.
Fundamentally, the ESLint CLI is a run-and-done application. It doesn't do any watching or reloading on its own, it just reads the config files once, executes, and exits. If you're using the Webpack ESLint plugin, then it's using our API to run ESLint rather than the CLI, and because you have it in watch mode, it probably has the config file cached. So, your best bet is likely to work with the Webpack ESLint plugin to see if it can reload the config file for you.
(As a note, because you're using such an old version of ESLint, any changes we made likely would not help you. We're on ESLint v9.x and all new features are added into that line, not to any older versions.)
ESLint version
v5.16.0
What problem do you want to solve?
Hello,
I'm currently woking on a react app which has a lot of legacy code. For context this runs with Eslint v5.16.0, Node v12.21.0 and Webpack 4.44.2. We decide to start enforcing some new eslint rules and we want to apply them only on the new files(linting the entire app would turn everything into a "blood bath").
It's my first time doing this so I did some research and read a lot of recommendations on stackoverflow, git, discord threads and git issues.
So far I ended up creating a custom webpack plugin which hooks into the watch lifecycle and runs the steps bellow:
const newFiles = require('./new-files');..."overrides": [ { "files": newFiles...The issue I've runned into is that, each time I add a new file, webpack properly runs the steps above and updates new-files.js but eslint does not detect that somethig has changed inside the eslintrc.js - overrides option so I need to somehow restart the server in order to apply the latest changes.
I know that an alternative would be from now on to add all the new code into a separate folder called new and use this as a file pattern in the eslint config. Although this should work, it's a bit cumbersome to change the files structure of the current codebase and requires a lot of additional changes.
Another solution that was suggested to me was eslint-watch, which I managed to make it work using an older version but it feels like an unnecessary extra layer, as I'm already running webpack in watch mode.
The purpose of this tool is to have a way to automatically detect potential errors as soon as possible and not wait until pre-commit(we have a hook which properly checks the lint rules).
The missing link is that I would need a way to make eslint dinamically detect changes inside .eslintrc.js.
What do you think is the correct solution?
Not sure if this is a good approach but maybe having an eslint cli option like eslint -restart / eslint -reload, would help in the flow above by running it inside webpack on build time and make the .eslintrc.js reload if a new file was added.
Any help or suggestion is highly appreciated. Thank you in advance!
Participation
Additional comments
No response