Struggling with getting ESLint to function properly on a new Angular project in VS Code. The error message I keep encountering is about failing to load "@typescript-eslint/eslint-plugin". After spending the past 3 hours troubleshooting, I have searched high and low for a solution.
Failed to load plugin '@typescript-eslint' declared in 'png-ui/.eslintrc.js': Cannot find module '@typescript-eslint/eslint-plugin'
Require stack:
- /Users/Yahia/Desktop/Plugngrow-UI/__placeholder__.js
Referenced from: /Users/Yahia/Desktop/Plugngrow-UI/png-ui/.eslintrc.js
Happened while validating /Users/Yahia/Desktop/Plugngrow-UI/png-ui/.eslintrc.js
This can happen for a couple of reasons:
1. The plugin name is spelled incorrectly in an ESLint configuration file (e.g. .eslintrc).
2. If ESLint is installed globally, then make sure '@typescript-eslint/eslint-plugin' is installed globally as well.
3. If ESLint is installed locally, then '@typescript-eslint/eslint-plugin' isn't installed correctly.
Consider running eslint --debug /Users/Yahia/Desktop/Plugngrow-UI/png-ui/.eslintrc.js from a terminal to obtain a trace about the configuration files used.
Here are the steps I've taken so far in trying to debug:
- I uninstalled both the global version and extension of ESLint, reinstalled the extension, and installed ESLint locally within the project folder.
- Starting fresh with an Angular app created using the
ng newcommand. - Executed the
command, resulting in minimal warnings except for ignoring the ".eslintrc.js" file during debugging.eslint --debug /Users/Yahia/Desktop/Plugngrow-UI/png-ui/.eslintrc.js
For reference, ESLint functions without issue in another project downloaded from the Angular docs while completing the introductory tutorial.
I've set up a Github repo for this project in case it helps with inspection.
Please bear with me as I navigate through my novice programming skills and related tools.