Error keeps popping up: Configuration for rule "react/jsx-uses-react" is invalid - sublimetext3

When I save any js file in Sublime text 3 the error pasted below keeps popping up.
I have tried a reinstall of eslint, eslint-plugin-import, eslint-config-airbnb, eslint-plugin-react, but no results.
any ideas?
error: Error: C:\Users\user_name\node_modules\eslint-config-airbnb\rules\react.js:
Configuration for rule "react/jsx-uses-react" is invalid:
Value "[object Object]" should NOT have more than 0 items.
Referenced from: C:\Users\user_name\node_modules\eslint-config-airbnb\index.js
Referenced from: C:\Users\user_name\.eslintrc
Error: C:\Users\user_name\node_modules\eslint-config-airbnb\rules\react.js:
Configuration for rule "react/jsx-uses-react" is invalid:
Value "[object Object]" should NOT have more than 0 items.
Referenced from: C:\Users\user_name\node_modules\eslint-config-airbnb\index.js
Referenced from: C:\Users\user_name\.eslintrc
at validateRuleOptions (C:\Users\user_name\Dev\node_modules\eslint\lib\config\config-validator.js:113:15)
at Object.keys.forEach.id (C:\Users\user_name\Dev\node_modules\eslint\lib\config\config-validator.js:153:9)
at Array.forEach (native)
at validateRules (C:\Users\user_name\Dev\node_modules\eslint\lib\config\config-validator.js:152:30)
at Object.validate (C:\Users\user_name\Dev\node_modules\eslint\lib\config\config-validator.js:230:5)
at loadFromDisk (C:\Users\user_name\Dev\node_modules\eslint\lib\config\config-file.js:549:19)
at load (C:\Users\user_name\Dev\node_modules\eslint\lib\config\config-file.js:592:20)
at configExtends.reduceRight.e (C:\Users\user_name\Dev\node_modules\eslint\lib\config\config-file.js:421:36)
at Array.reduceRight (native)
at applyExtends (C:\Users\user_name\Dev\node_modules\eslint\lib\config\config-file.js:403:28)
(node:11548) DeprecationWarning: [eslint] The 'ecmaFeatures' config file property is deprecated, and has no effect. (found in C:\Users\user_name\node_modules\eslint-config-airbnb\rules\react.js)

I had this problem with Atom. You need to configure eslint to support jsx. Add this to your .eslintrc file. Particularly the parserOptions field! Make sure you have eslint-plugin-react installed properly as well.
eslint-plugin-react on github
{
"extends": [
"eslint:recommended",
"plugin:react/recommended"
],
"parserOptions": {
"ecmaVersion": 6,
"ecmaFeatures": {
"jsx": true
}
},
"plugins": [
"react"
],
}

Related

nuxt3 + #nuxt/content ... ERROR Failed to parse source for import analysis because the content contains invalid JS syntax

I would like to use nuxt/content for some content from a database. When starting the development environment with npm run dev I get the following message
ERROR Failed to parse source for import analysis because the content contains invalid JS syntax. If you are using JSX, make sure to name the file with the .jsx or .tsx extension.
and
[Vue warn]: Failed to resolve component: nuxt-content
my config
//nuxt.config.ts
export default defineNuxtConfig({
modules: [
'#nuxtjs/tailwindcss',
'#pinia/nuxt',
'#nuxt/content',
],
imports: {
dirs: ['stores'],
},
buildModules: [
'#nuxt/postcss8',
'#pinia/nuxt',
],
build: {
postcss: {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
},
},
css: [
'#/assets/style/main.scss',
],
})
When i remove the module #nuxt/content the error message also disappears.
By the way, I use vite in this project.

Error [ERR_REQUIRE_ESM] - Husky, lint-staged, eslint - nodeJS:

although there were other questions about this, most were left without a response or the response given did not work for me.
For what it gives apparently eslint is looking within node_modules, here is the given error:
Error [ERR_REQUIRE_ESM]: require() of ES Module /home/kamoraes/Workspace/node_adc/node_modules/supports-color/index.js from /home/kamoraes/Workspace/node_adc/.git/hooks/commit-msg not supported.
Instead change the require of index.js in /home/kamoraes/Workspace/node_adc/.git/hooks/commit-msg to a dynamic import() which is available in all CommonJS modules.
at Object.<anonymous> (/home/kamoraes/Workspace/node_adc/.git/hooks/commit-msg:8:23) {
code: 'ERR_REQUIRE_ESM'
}
Node v16.13.0
The problem is, the project is in it's first steps, quickly redoing the project in another machine on the same node and yarn, version, don't give the same error. Also asked a friend of mine to try it. no error given.
also, this project is an course, same steps made, here is my entire code as for now:
https://github.com/kaiqueAMoraes/clean-node-api
the last commit for this given error is chore: eslintignore 6250e5bdea05cc2eb413c8a57a97e4bbe4bd5bb9
I've added husky, lint-staged
yarn add -D husky lint-staged
then added their respectively config files
.huskyrc.json:
{
"hooks": {
"pre-commit": "lint-staged"
}
}
.lintstagedrd.json:
{
"*.ts": [
"eslint 'src/**' --fix",
"git add"
]
}
for reference:
tsconfig:
{
"compilerOptions": {
"outDir" : "./dist",
"module": "commonjs",
"target": "es2019",
"strictNullChecks": true,
"esModuleInterop": true,
"allowJs": true
}
}
eslintrc:
{
"extends": "standard-with-typescript",
"parserOptions": {
"project": "./tsconfig.json"
}
}
both gitignore and eslintignore ignores node_modules and dist
Ran into the same issue.
You could bypass the check with git commit -m "your message here" --no-verify.

Using eslint causes my string to fail with no-irregular-whitespace error

I've started to use eslint (migrated from tslint) but this is throwing an error, not sure why!
Code snippet
const url = `${this.url}​/members​/${memberId}​/profile`;
It's super strange as other similar lines of code are not causing a problem! I'm not sure how to resolve this problem.
Full error message
Irregular whitespace not allowed.
eslint version = ^7.31.0
Thanks!!
Update
I have the following config but it produces an error when running lint
plugins: ["#typescript-eslint", "react"],
extends: [
"eslint:recommended",
"plugin:#typescript-eslint/recommended",
"plugin:react/recommended"
],
rules: {},
Error message
ESLint couldn't find the plugin "eslint-plugin-react".
Solution
Add this to the eslint config file:
rules: {
"no-irregular-whitespace": [
"error",
{ skipRegExps: true, skipTemplates: true },
],
},
Make sure your eslint config has:
"extends": [
"plugin:react/recommended"
]
...
"plugins": [
"react"
]

Why is linting failing with "Unexpected token ." on "import.meta.url"?

I have the following lint config...
{
"extends": ["eslint:recommended", "google"],
"parserOptions": {
"ecmaVersion": 2020,
"sourceType": "module"
},
"rules": {
"require-jsdoc": 1
},
"env": {
"es6": true
}
}
and the following code...
const __dirname = path.dirname(new URL(import.meta.url).pathname);
//^Error is...
But when it lints I get...
9:46 error Parsing error: Unexpected token .
This is a pretty common piece of code so I am confused.
Update
solved with...
"ignorePatterns": ["unclean.mjs", "node_modules"],
But I would like a solution where I don't have to ignore an entire file.
It is a syntax error because the default parser of ESLint only supports stage 4 proposals, but import.meta is currently stage 3. For now, you must change the parser to "babel-eslint" or "#typescript-eslint/parser" in order to parse import.meta.
That phrase is a syntax error because import is a keyword in EcmaScript. Therefore import.meta is as invalid as if.foo or switch.foo.

need a correct eslintrc for async/await - using 7.6+ nodejs

With the latest version of nodejs 7.6+ I started using async/await.
I was using jshint but from what I read they currently do support this syntax and some suggested using eslint.
So ok I set eslint up but argh.. it flags async functions too.
Parsing error: Unexpected token init (Fatal)
I know there is nothing wrong as my code is running fine it's just the linter. Too if I comment out an async function it just flags the next one. IN fact eslint only flags the first async found with this error not all of them (what up with that?)
Here is the eslintrc file made using the init wizard. I was hoping just asking for node and es6 for env would be sufficient...apparently not.
module.exports = {
"env": {
"es6": true,
"node": true
},
"extends": "eslint:recommended",
"rules": {
"indent": [
"error",
"tab"
],
"linebreak-style": [
"error",
"unix"
],
"quotes": [
"error",
"single"
],
"semi": [
"error",
"never"
]
}
};
What is the fix?
I've tried several versions of .eslintrc and even saw there are a few issues related at the eslint repo but none are helping me to resolve this. I don't think it's a bug just missing something about getting eslint set up correctly for native nodejs using commonjs (no babel).
Who knows maybe babel plugin is required to make this work even though I am not using babel??? If that's true how do I set that up.
Since async/await is an ES2017 feature, you need to add that to your .eslintrc.js:
module.exports = {
// ...
"parserOptions": {
"ecmaVersion": 2017
},
// ...
}

Resources