My settings.json:
"eslint.options": {
"overrideConfigFile": {
"env": {
"browser": true,
"jest/globals": true,
"es6": true
},
"parserOptions": {
"ecmaVersion": 2019,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"rules": {
"no-debugger": "off"
}
}
},
My previous ESLint errors were that 'env', 'parserOptions' and 'rules' had to be wrapped in an overrideConfigFile which fixed those errors, now I'm getting error "ESLint: Invalid Options: - 'overrideConfigFile' must be a non-empty string or null..". Has anybody come across this or understand why this isn't working? Google isn't being my friend & changing overrideConfigFile to be null or empty string would just bring about the previous errors.
Related
I am getting following when running eslint in a Gatsby project
Oops! Something went wrong! :(
ESLint: 7.32.0
[ProjectNotFoundError: File '/home/path_to_project/somefile.ts' doesn't match any project] {
name: 'ProjectNotFoundError',
message: "File '/home/path_to_project/somefile.ts' doesn't match any project"
}
My .eslintrc
{
"extends": [
"react-app",
"plugin:jsx-a11y/recommended",
"prettier",
"plugin:tailwindcss/recommended"
// "airbnb"
],
"plugins": ["jsx-a11y"],
"rules": {
"no-restricted-imports": [
"error",
{
"patterns": ["#/features/*/*"]
}
],
"tailwindcss/classnames-order": "error",
"tailwindcss/no-custom-classname": "error"
},
"settings": {
"tailwindcss": {
"groupByResponsive": true
}
},
"overrides": [
{
"files": ["*.ts", "*.tsx"],
"processor": "#graphql-eslint/graphql",
"parser": "#typescript-eslint/parser",
"extends": [
"eslint:recommended",
"plugin:#typescript-eslint/recommended"
],
"env": {
"es6": true
}
},
{
"files": ["*.graphql"],
"parser": "#graphql-eslint/eslint-plugin",
"plugins": ["#graphql-eslint"],
"rules": {
"#graphql-eslint/no-anonymous-operations": "error",
"#graphql-eslint/naming-convention": [
"error",
{
"OperationDefinition": {
"style": "PascalCase",
"forbiddenPrefixes": ["Query", "Mutation", "Subscription", "Get"],
"forbiddenSuffixes": ["Query", "Mutation", "Subscription"]
}
}
]
}
}
]
}
.eslintignore
node_modules/
.cache/
public/
.idea/
yarn-error.log
.yarn/
Commenting out the following section in .eslintrc fix the issue, but I want to keep that section, things used to work fine with that section before. No clue what's wrong, since the error message provided by ESLint is pretty vague.
{
"files": ["*.ts", "*.tsx"],
"processor": "#graphql-eslint/graphql",
"parser": "#typescript-eslint/parser",
"extends": [
"eslint:recommended",
"plugin:#typescript-eslint/recommended"
],
"env": {
"es6": true
}
},
Update
Problem seems to be due to following, since commenting it out fix the error.
"processor": "#graphql-eslint/graphql",
I was earlier using Gatsby's GraphQL Typegen disabled due to it buggy nature (rebuild loop and .cache errors) by commenting out graphql.config.js and removing graphqlTypegen: true, from gatsby-config.ts
According to graphql-eslint
If you are defining GraphQL schema or GraphQL operations in code files, you'll want to define an additional override to extend the functionality of this plugin to the schema and operations in those files.
{
"overrides": [
+ {
+ "files": ["*.js"],
+ "processor": "#graphql-eslint/graphql"
+ },
...
}
It seems, disabling GraphQL Typegen result in mentioned error in "processor": "#graphql-eslint/graphql" of eslint override.
I set in my .eslintrc the rule "quote-props": [2, "always"]. When I do eslint --fixit will work properly.
But I format my code with Prettier. Unfortunately Prettier has no always but as-needed|preserve|consistent for quote-props. So the result is always that it removes my quote props when I format with Prettier.
How can I tell Prettier to respect this rule? Adding // prettier-ignore is not an option.
.eslintrc:
"extends": [
"eslint:recommended",
"plugin:react/recommended",
"plugin:react-hooks/recommended",
"prettier",
"prettier/react"
], // Prettier or Prettier Plugins (here for React) must always be at the end
"env": {
"cypress/globals": true,
"node": true,
"browser": true,
"es6": true
},
"plugins": ["react", "cypress", "prettier"],
"settings": {
"react": {
"createClass": "createClass",
// Regex for Component Factory to use, default to "createClass"
"pragma": "React",
// Pragma to use, default to "React"
"version": "16.13.1"
// React version, default to the latest React stable release
}
},
"parser": "babel-eslint",
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": 8,
"sourceType": "module"
},
"rules": {
"quote-props": [2, "always"]
...
.prettierrc:
module.exports = {
trailingComma: "none",
tabWidth: 4,
bracketSpacing: true,
arrowParens: "avoid"
};
Since Prettier doesn't support an "always-quote-props" option but eslint does, I removed the quote-props setting from my .prettierrc-file and set in my .eslintrc quote-props to ["error", "always"].
Finally I used prettier-eslint:
This formats your code via prettier, and then passes the result of that to eslint --fix. This way you can get the benefits of prettier's superior formatting capabilities, but also benefit from the configuration capabilities of eslint
I have this simple example, where statements dont have semicolons. Prettier settings have the semi to false but eslint has the semi to true. I order to not have conflicts between them i installed the eslint-config-prettier. But i still get an error with the semicolons. It is supposed to prevail the prettier setting, but its does not.
var var1, var2
var1 = 3
var2 = 4
var a = { name: "" }
"devDependencies": {
"eslint": "^7.8.1",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-prettier": "^3.1.4",
"prettier": "^2.1.1"
}
.prettierrcc
{
"arrowParens": "always",
"bracketSpacing": true,
"htmlWhitespaceSensitivity": "css",
"insertPragma": false,
"jsxBracketSameLine": false,
"jsxSingleQuote": false,
"printWidth": 86,
"proseWrap": "preserve",
"quoteProps": "preserve",
"requirePragma": false,
"semi": false,
"singleQuote": false,
"tabWidth": 2,
"trailingComma": "es5",
"useTabs": false,
"vueIndentScriptAndStyle": false
}
.eslintrcc
{
"root": true,
"env": {
"node": true
},
"extends": ["prettier"],
"plugins": ["prettier"],
"rules": {
"semi": ["error", "always"],
"prettier/prettier": ["error"]
}
}
I get the following error:
/home/nick/Documents/Coding/NodeJs/simple-node/vanilla.js
1:17 error Missing semicolon semi
2:11 error Missing semicolon semi
3:9 error Missing semicolon semi
4:21 error Missing semicolon semi
You are overwriting the Prettier config which is indeed set to "off" by default (link to config), with a custom rule who does the opposite of what you want. Simply remove it:
"rules": {
"prettier/prettier": ["error"]
}
I cannot make a config to override the main configuration of the eslint.js
.eslintrc
module.exports = {
"root": true,
"env": {
"node": true,
"browser": true,
},
"globals": {},
"parserOptions": {
"ecmaVersion": 5,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true,
},
},
"extends": ["myplugin"],
"rules": {
"prettier/prettier": ["error"],
},
}
eslint-config-myplugin
module.exports = {
"parserOptions": {
"ecmaVersion": 6,
}
}
i get this error:
0:0 error Parsing error: sourceType 'module' is not supported when ecmaVersion < 2015. Consider adding { ecmaVersion: 2015 } to the parser options
✖ 1 problem (1 error, 0 warnings)
That’s the way it is designed to work, set the parser option to what you need it to be in .eslintrc
I have the following imports in my file:
import axios from "axios";
import lodash from "lodash";
import PropTypes from "prop-types";
import React from "react";
import renderInCustomHtmlTag from "react-render-custom-html-tag";
I am using v5.9.0 however for some reason I am getting an error for line 3 even though it appears to be alphabetical order.
My eslint is as follows:
{
"env": {
"browser": true,
"commonjs": true,
"es6" : true,
"jquery": true,
"node": true
},
"extends": [
"eslint:all",
"plugin:react/recommended"
],
"globals": {
"$cgx": true
},
"parser": "babel-eslint",
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"sourceType": "module"
},
"plugins": [
"import",
"jsx-a11y",
"react"
],
"rules": {
"indent": ["error", 2],
"max-len": [
"error",
{
"code": 120
}
]
}
}
The issue is probably the capital letters. It seems to be because they have a lower ASCII value A = 65, a = 97.
https://eslint.org/docs/2.0.0/rules/sort-imports