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"]
}
Related
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.
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 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'm using sublime as my IDE, and have downloaded sublimelinter for linting my javascript with eslint. In the sublimelinter.sublimesettings file, I have it configured to use eslint shown below:
{
"user": {
"debug": false,
"delay": 0.25,
"error_color": "D02000",
"gutter_theme": "Packages/SublimeLinter/gutter-themes/Default/Default.gutter-theme",
"gutter_theme_excludes": [],
"lint_mode": "load/save",
"linters": {
"eslint": {
"#disable": false,
"args": [],
"excludes": [],
}
},
"mark_style": "outline",
"no_column_highlights_line": false,
"passive_warnings": true,
"paths": {
"linux": [],
"osx": [],
"windows": []
},
"python_paths": {
"linux": [],
"osx": [],
"windows": []
},
"rc_search_limit": 3,
"shell_timeout": 10,
"show_errors_on_save": false,
"show_marks_in_minimap": true,
"syntax_map": {
"html (django)": "html",
"html (rails)": "html",
"html 5": "html",
"javascript (babel)": "javascript",
"magicpython": "python",
"php": "html",
"python django": "python",
"pythonimproved": "python"
},
"warning_color": "000000",
"wrap_find": true
}
}
My problem is I can't find anything online to suppress the warnings that come from eslint. I've tried using "ignore": "W" as a value within eslint but it didn't work. Eslint works fine, I just can't seem to find a solution to suppressing the warnings. Any ideas?
EDIT:
Here's my .eslintrc file:
{
/* Don't search any further for .eslintrc files */
"root": true,
/* See all the pre-defined configs here: https://www.npmjs.com/package/eslint-config-defaults */
"extends": [
"eslint:recommended",
"defaults/configurations/google"
],
"ecmaFeatures": {
"jsx": true
},
"env": {
"browser": true,
"node": true,
"es6": true
},
"globals":{
"angular": 1,
"phoenix": 1,
"requirejs": 1
},
"rules": {
"indent": [
2,
2,
{ "SwitchCase": 1 }
],
/* We don't do this consistently, so disable it as it is treated as an error otherwise */
"newline-after-var": 0,
"dot-location": [2, "property"],
"no-extra-semi": 1,
"semi": 2,
"max-len": [2, 250, 2],
"eqeqeq": 2,
"comma-dangle": 1,
"no-console": 0,
"no-debugger": 1,
"no-extra-parens": 1,
"no-irregular-whitespace": 0,
"no-undef": 1,
"no-unused-vars": 2,
"semi-spacing": 1
}
}
The --quiet flag will suppress all warnings, but does not silence errors. Via the command line, you can run:
eslint --quiet
Alternatively, to have this flag automatically appended, add "quiet" to the args of the ESLint configuration, so you don't have to remember to add the flag each time.
Getting the following error when running jshint;
line 4 col 5 Redefinition of '_'.
the code is complaining out is;
var _ = require('lodash');
jshint in project
{
"node": true,
"esnext": true,
"bitwise": true,
"eqeqeq": true,
"immed": true,
"latedef": "nofunc",
"newcap": true,
"noarg": true,
"regexp": true,
"undef": true,
"smarttabs": true,
"asi": true,
"debug": true,
"globals": {
"angular": false,
"_": false
}
}
Updated the .jshintrc to the following which seems to have resolved the problem.
{
"node": true,
"browser": true,
"esnext": true,
"bitwise": false,
"camelcase": false,
"eqeqeq": true,
"immed": true,
"indent": 4,
"latedef": true,
"newcap": true,
"noarg": true,
"quotmark": "single",
"regexp": true,
"undef": true,
"unused": false,
"strict": true,
"trailing": true,
"smarttabs": true,
"globals": {
"jQuery": true,
"angular": true,
"console": true,
"AppConfig": true,
"$": true,
"_": true,
"moment": true,
"module": true,
"inject": true,
"browser": true,
"element": true,
"describe": true,
"before": true,
"beforeEach": true,
"after": true,
"afterEach": true,
"expect": true,
"it": true,
"by": true,
"chai": true
}
}
Also created a .jshintrc-spec
{
"extends": ".jshintrc",
"globals": {
"describe": true,
"it": true,
"before": true,
"beforeEach": true,
"after": true,
"afterEach": true,
"chai": true,
"inject" : true
}
}
A better (and commonly used) way to resolve this is to use double underscores __ while requiring either underscore or the lodash library. No need to make a change to the jshintrc file just for this.