I have a eslint config which extends some others. Those packages depend on "#typescript/eslint-plugin" but they use different versions.
extends: ['airbnb', 'airbnb-typescript', '#some-private-eslint-cfg'],
This results in Eslint being unable to start. It complains about ambiguity, it cannot determine which version to use.
The error:
Oops! Something went wrong! :(
ESLint: 8.19.0
ESLint couldn't determine the plugin "#typescript-eslint" uniquely.
Please remove the "plugins" setting from either config or remove either plugin installation.
However, since I can't edit the configs of those packages I'm extending, I can't remove it from plugins[] and I can't uninstall it.
How to solve this? Ideally, I would like to add something to my top level .eslintrc to handle this. Is this possible?
Related
I configured eslint js test and installed ESLint add-on for VSC. Now eslint test screaming at me and tells me to move somewhere the function declarations. Could someone tell me where the error is, please?
https://github.com/ewaolczak/javascript-blog/commit/38776188eef93f8cbd40e9de64bf97fa20bd386a?w=1
We have a CircleCI Pipeline. We have a older version of eslint i.e. 5.10.0 which was around three years ago installed and now client wants to upgrade node version to 16 and upgrade related packages.
I have modified package.json file and changes eslint version from "eslint": "^5.10.0" to "eslint": "^7.10.0".
Now, while pushing changes on branch CircleCI test execution fails with the below error.:
Oops! Something went wrong! :(
ESLint: 7.32.0
ESLint couldn't find the config "standard" to extend from. Please check that the name of the config is correct.
The config "standard" was referenced from the config file in "/home/xxx/xxx/.eslintrc.yml".
I have googled for this issue but did not find the proper solution for this.
I have tried to
Removed .eslintrc.yml file by guessing that it can be created automatically.
Try to run the command yarn run eslint --init inside package.json under script tag
"scripts": {
"test": "yarn run eslint --init && yarn lint && yarn flow && yarn jest",
}
But here, CircleCI pipeline is used so eslint --init command will ask question
How would you like to use ESLint?
We don't have any provision in CircleCI during automated file and test execution to provide any answer.
I had a similar case, where this error was due to my eslint version being too new compared to the one required by standard.
Here are some steps you can try to verify whether that's the case for you as well:
Locally in your project, run npm init #eslint/config (will ask you some questions and generate a new .eslint.{js|yml|json} out of it)
When asked "Which style guide do you want to follow?" reply standard
at this point, you should see something on the line of
The style guide "standard" requires eslint#^7.12.1. You are currently using eslint#{version}
Do you want to downgrade?
choosing "No" will warn you as follow and cause the error you mentioned when trying to execute linting.
Note: it might not work since ESLint's version is mismatched with the standard config
In my case the eslint version was differing by major (8.11.0) which makes it more obvious, but it looks very similar to what you have too.
If by this point you figured that's indeed the issue, here are some alternatives that might help:
Downgrade eslint (easy one but won't work in the long run if you like your dependencies to be up-to-date)
Switch to another style guide which doesn't have this limitation with eslint version (eg. airbnb or google's are suggested by the config setup)
Switch to using standard directly instead of going through eslint
I am no expert in js world, so please feel free to point out anything I missed
The Situation
I'm working on a Docusaurus project which will include some custom components. I'd like to also use ESLint, and in particular the AirBnB config.
When I run the linter on the initially generated Docusaurus project I get a few errors (not unexpected), but these three give me pause:
src/pages/index.jsx
3:20 error Unable to resolve path to module '#theme/Layout' import/no-unresolved
4:18 error Unable to resolve path to module '#docusaurus/Link' import/no-unresolved
5:34 error Unable to resolve path to module '#docusaurus/useDocusaurusContext' import/no-unresolved
I suspect these modules are aliases that Docusaurus knows how to resolve, but ESLint doesn't.
The Question
I would like to avoid disabling import/no-unresolved.
Is there a handy way for me to get ESLint to recognize (and resolve) the aliases that come from Docusaurus?
#theme, #docusaurus, etc aren't actual paths. They are webpack aliases. To prevent ESLint from tripping up on those, you could ignore those in the ESLint settings
"import/no-unresolved": [ 2, {"ignore": ["^#theme", "^#docusaurus", "^#site"]}],
I've set up a new nodeJS project with typescript. My linter is flagging me with errors, for example:
import authentication from "./routes/authentication"; // Flags "Cannot find module ..."
I would like it to flag a warning/error for these statements, as they break my app when I try to load it:
const pool = require("../database/db"); // Currently not flagging as a warning either for the fact that the file does not exist, or that it is using a require() statement.
I'm guessing eslint is doing my linting. But I haven't explicitly set it up. I tried creating and playing with a .eslint.rc file, but nothing happened.
How do I check what my linter is? I can't find anything in my VS-Code settings to say what I'm using. I can't find any reference to it in my package.json or tsconfig.json files that reference a linter either?
How do I then get my linter to flag require() statements?
So it looks like eslint was already running. It was installed in my extensions, but I've no idea what rules it was using. It must have been some defaults?
I ran yarn add eslint -D and npx eslint --init to set up eslint. Then I changed the rules: object in my .eslintrc.js file. This seems to have changed the linting, which suggests I was already using eslint.
I haven't yet worked out how to flag errors for the require() statements. I've found this YouTube video, which explains that:
require() statements are just functions. We can write require() statements within if() conditions and functions. This is not possible with import ... from ... statements
Because require() statements are functions, they are only being called in runtime. imports are static, so they are being checked by typescript in parse time. This is useful as it means we can get errors before moving into runtime.
I never found a better way of checking what linter my VS-Code was running other than setting up eslint with the github.com/typescript-eslint/... instructions and then playing with the .eslintrc.js file to see that the rules changed. Even then I had to runyarn eslint . --ext .js,.jsx,.ts,.tsx before the rules:{} in my .eslintrc.js started to take effect.
In order to get the require() statements to flag up with my linter, I added the following to my .eslintrc.js rules:{} property:
rules: {
"#typescript-eslint/no-var-requires": 1,
...
}
Although this didn't take effect until after I'd followed the steps described in item 1. As stated above, for some reason I had to run yarn eslint . --ext .js,.jsx,.ts,.tsx before the rules:{} in my .eslintrc.js started to take effect.
I have a problem with my Angular project build, and ultimately deployment to heroku. I'm using an old(ish) npm package called binary parser, which causes the following error on when I build / deploy to heroku:
Module not found: Error: Can't resolve 'console' in '/tmp/build_e75b87f248f44978f9537d83b3172254/node_modules/binary-parser/dist'
The binary-parser.js has a line require("console"); which is used in exactly one place, so local builds succeed and the application works perfectly, if only I remove console from that line altogether. But as, heroku installs node modules when deploying, this only helps when I manually build the prod version.
I have installed typings for binary-parser and for TS, and also included "types": ["node"] in both tsconfig.json and tsconfig.app.json compilerOptions.
As angular these days doesn't really allow for webpack configuration, I've tried adding global.console = global.console || require('console-browserify');
(or)
global.console = global.console || require('console');
to my polyfills, to no avail.
Any ideas on how to solve this? Do I need to configure a custom webpack to circumvent this? I'll gladly post additional information if necessary!
Here's a possible cause, may or may not be what you or others reading this question are experiencing...
My IDE's auto importing added import * as console from "console"; when I typed console.log.
Solution was of course to remove that import statement.
After trying for multiple hours to come up with the right configuration, the only solution I could come up with was forking the repo in question and changing tsconfig target from es5 to es6, which got rid of the console import altogether upon compilation.