Eslint stops working yet again..
{
"extends": ["airbnb"],
"root": true,
"parser": "babel-eslint",
"env": {
"browser": true
},
"plugins": [
"react-hooks",
"react"
],
"rules": {
"react-hooks/rules-of-hooks": "error",
"react-hooks/exhaustive-deps": "error",
Using VSCODE Version: 1.47.0-insider
useEffect(() => {
someVarOutside
}, []);
The above should warn that someVarOutside is missing from dep array. react-hooks was working. Now it is not.
Related
I am using eslint extension in vscode and it is always showing me the parser error which says that it cannot read tsconfig.json but when I run in the bash the command "eslint --ext .ts ." then it does not show there is any problem but only in the vscode eslint extension it's showing that problem.
Also, I noticed that it is not complaining about missing semicolons.
tsconfig.json
{
"compilerOptions": {
"target": "ES6",
"module": "commonjs",
"resolveJsonModule": true,
"outDir": "./build/",
"esModuleInterop": true,
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"skipLibCheck": true
}
}
.eslintrc
{
"extends": [
"eslint:recommended",
"plugin:#typescript-eslint/recommended",
"plugin:#typescript-eslint/recommended-requiring-type-checking"
],
"plugins": [
"#typescript-eslint"
],
"env": {
"browser": true,
"es6": true,
"node": true
},
"rules": {
"#typescript-eslint/semi": [
"error"
],
"#typescript-eslint/explicit-function-return-type": "off",
"#typescript-eslint/explicit-module-boundary-types": "off",
"#typescript-eslint/restrict-template-expressions": "off",
"#typescript-eslint/restrict-plus-operands": "off",
"#typescript-eslint/no-unsafe-member-access": "off",
"#typescript-eslint/no-unused-vars": [
"error",
{
"argsIgnorePattern": "^_"
}
],
"no-case-declarations": "off"
},
"parser": "#typescript-eslint/parser",
"parserOptions": {
"project": "./tsconfig.json"
}
}
We're using #babel/cli to build a library. I've been trying to show eslint issues when using babel --watch ... but no issues are reported.
babel.config.json
{
"presets": [
"#babel/preset-env",
"#babel/preset-react",
"#babel/preset-typescript"
]
}
.eslintrc
{
"env": {
"browser": true,
"node": true
},
"parser": "#babel/eslint-parser",
"extends": ["eslint:recommended", "plugin:react/recommended", "prettier"],
}
Is it possible to show eslint issues in #babel/cli's output?
I have a eslint config file .eslintrc.json (could be .eslintrc) like this:
{
"env": {
"browser": true,
"es6": true
},
"extends": [
"eslint:recommended",
"plugin:react/recommended",
"plugin:#typescript-eslint/eslint-recommended",
"airbnb-typescript-prettier"
],
"plugins": [
"#typescript-eslint"
],
"globals": {
"Atomics": "readonly",
"SharedArrayBuffer": "readonly"
},
"parser": "#typescript-eslint/parser",
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": 2018,
"sourceType": "module"
},
"overrides": [
{
"files": ["*.js", "*.jsx"],
"processor": "babel-eslint"
}
],
"rules": {
"react/prop-types": 0,
"semi": ["error", "never"]
}
}
and I got a persistent error
Error: ESLint configuration of processor in '.eslintrc.json#overrides[0]' is invalid: 'babel-eslint' was not found
Although official eslint site suggest this configuration, you need to use parser property in the overrides instead of processor such as the following:
...
"overrides": [
{
"files": ["*.js", "*.jsx"],
"parser": "babel-eslint"
}
],
...
With this change everything works pretty well.
I have a project with both JS and TS files (and JSX/TSX). I have a separate .eslintrc.json file for JS vs. TS. I'd like to be able to tell VSCode which eslint config file to use depending on the file extension.
Tried putting the settings in settings.json under the [typescript] field but that didn't work.
I think it should be possible to use 1 file and overrides option:
.eslintrc.js
module.exports = {
"root": true,
"plugins": ["#typescript-eslint"],
"rules": {
// JavaScript rules
},
"overrides": [
{
"files": ["*.ts", "*.tsx"],
"parser": "#typescript-eslint/parser",
"parserOptions": {
"project": "./tsconfig.json"
},
"plugins": [
"#typescript-eslint"
],
"rules": {
// TypeScript rules
}
}
]
}
And changing workspace settings:
"eslint.validate": [
{
"language": "typescript",
"autoFix": true
},
{
"language": "typescriptreact",
"autoFix": true
}
]
I am using spacemacs and flycheck-eslint as linter to check my React code.
Here is my project's .eslintrc,
{
"extends": [
"eslint:recommended",
"plugin:react/recommended"
],
"parser": "babel-eslint",
"env": {
"browser": true,
"es6": true,
"node": true
},
"parserOptions": {
"ecmaFeatures": {
"experimentalObjectRestSpread": true,
"jsx": true
},
"sourceType": "module"
},
"plugins": [
"react"
],
"rules": {
"semi": [0, "never"],
"eqeqeq": 2,
"no-console": 1,
"no-unused-vars": [1, {"vars": "all", "args": "after-used"}],
"comma-spacing": [2, {"before": false, "after": true}],
"react/prop-types": [2, {
"ignore": ["dispatch"]
}]
},
"globals": {
"__DEV_MODE__": true,
"__API_SERVER__": true
}
}
I have set NO semicolon in the .eslintrc. I've try Atom Editor, Sublime Text3, VSCode, they work as expect.
But in spacemacs, I got the annoying underline hint.
How can I remove the annoying underline ??
Thanks!
After researching, I've found that it is not related to flycheck. The underline is added by js2-mode.
The solution is to add (setq js2-strict-missing-semi-warning nil) in .spacemacs file.