Eslint: warning File ignored by default. Use a negated ignore pattern - javascript

I am new in using Eslint.
So far I have installed Eslint in my local project and configured it. The eslintrc.js file contains
module.exports = {
env: {
node: true,
commonjs: true,
es6: true,
mocha: true,
},
extends: [
'airbnb-base',
],
globals: {
Atomics: 'readonly',
SharedArrayBuffer: 'readonly',
},
parserOptions: {
ecmaVersion: 2018,
},
rules: {
},
};
And in package.json I have
"scripts": {
"lint": "eslint .eslintrc.js --fix",
}
In terminal I run
npm run lint
And the output is
> apigateway#1.0.0 lint C:\nodeprojects\restapi
> eslint .eslintrc.js --fix
C:\nodeprojects\restapi\.eslintrc.js
0:0 warning File ignored by default. Use a negated ignore pattern (like "--ignore-pattern '!<relative/path/to/filename>'") to override
But if I run
eslint <foldername> --fix then it works.
I am using webstorm IDE and in windows os.
Any help is highly appreciated.

ESlint default behaviour is ignoring file/folders starting with . - https://github.com/eslint/eslint/issues/10341.
In case for example you want to lint .storybook folder, ESLint will ignore it by default. To lint it, .eslintrc.js must include:
{
...
// Lint ".storybook" folder (don't ignore it)
"ignorePatterns": ["!.storybook"],
...
}
Because of that default ESLint behaviour, I do in all my projects like this (lint whole project from the root) :
{
...
// ESlint default behaviour ignores file/folders starting with "." - https://github.com/eslint/eslint/issues/10341
"ignorePatterns": ["!.*", "dist", "node_modules"],
...
}
Where I first don't ignore any file/folder starting with . and then I exclude folders that I actually want to ignore.

Your npm script runs the linter on the .eslintrc.js file and this file is as the comment says File ignored by default.
You need to change the lint script from:
"lint": "eslint .eslintrc.js --fix",
to:
"lint": "eslint <foldername> --fix"
Where <foldername> is the correct folder.

I ran into this issue where the pre-commit Husky hook would try to scan this file when trying to commit merges (where someone changed .eslintrc.js previously), then this would fail the merge commit in team members' local envs (file ignored by default)
You can create a .eslintignore file next to .eslintrc.js. Then in .eslintignore put:
!.eslintrc.js

Related

Run typescript build with tsconfig-paths using pm2

I am trying to run the build (.js files) of typescript with the tsconfig-paths in production, I have no problem running typescript with paths. Just when running the build on production with pm2.
I have tried:
apps: [
{
name: 'app',
script: './dist/index.js',
node_args: '-r ts-node/register -r tsconfig-paths/register',
},
],
TLDR: If as I assume you run info *the* common misunderstanding about tsconfig you may try:
{
apps: [
{
name: 'app',
script: './dist/index.js',
node_args: '-r ts-node/register -r tsconfig-paths/register',
env: {
"TS_NODE_BASEURL": "./dist"
}
},
}
Explanation:
Typescript allows us to specify path aliases so that we don'y have to use ugly relative paths like ../../../../config. To use this feature typically you would have a tsconfig.json like this:
...
"outDir": "./dist",
"baseUrl": "./src", /* if your code sits in the /src directory */
"paths": {
"#/*": ["*"]
},
...
Now you can do the following:
import config from "#/config";
It will compile without errors. During the compilation the requested modules are in the src directory. However:
$ node -r tsconfig-paths/register dist/index.js
Failure! Cannot find module '#/config'
Why is that? Because at runtime config no longer sits inside ./src but instead can be found in ./dist.
So how do we handle this?
Fortunately tsconfig-paths allows us to override baseUrl with TS_NODE_BASEURL env:
$ TS_NODE_BASEURL=./dist node -r tsconfig-paths/register dist/index.js
Success!

ESLINT infinite loop

So i used eslint pretty normally until I added a specific rule, then eslint seemed to just loop infinite :
> api#1.0.0 pretest /api
> eslint .
this just stay forever. Never ending the process. So i removed that specific rule again, but it didnt fixed the problem.
This is my eslint file at the moment, but even if i change the rules it would still go infinite.
{
"extends": "airbnb-base/legacy",
"parserOptions": {
"ecmaVersion": 2018
},
"rules": {
"global-require" : 0,
"no-unused-vars" : 0
},
"env": {
"es6": true,
"node": true
}
}
this is my rule in the package.json :
"pretest": "eslint .",
Try ignoring node_modules/ folder:
eslint . --ext .js --ignore-pattern node_modules/
Also, you can ignore specific folders using .eslintignore file in the root of your project:
.eslintignore
/dist
/node_modules

Parsing Error The Keyword import is Reserved (SublimeLinter-contrib-eslint)

I have a problem with eslint, it gives me [Parsing Error The keyword import is reserve] this is only occur in sublime, in atom editor work well. I have eslint
.eslintrc.js
module.exports = {
"extends": "airbnb",
"plugins": [
"react"
]
};
package.json
{
"name": "paint",
"version": "0.0.0",
"description": "paint on the browser",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [
"paint",
"javascript"
],
"author": "",
"license": "ISC",
"devDependencies": {
"browserify": "^11.2.0",
"eslint": "^2.2.0",
"eslint-config-airbnb": "^2.1.1",
"eslint-plugin-react": "^3.11.2",
"gulp-babel": "^5.2.1",
"gulp-clean": "^0.3.1",
"gulp-stylus": "^2.2.0",
"vinyl-source-stream": "^1.1.0"
}
}
Add this to the root of your .eslintrc.json (formerly .eslintrc)
"parser": "babel-eslint"
and make sure to run:
npm install babel-eslint --save-dev
The eslint option that solves the "The keyword import is reserved" error is parserOptions.sourceType. Setting it to "module" allows the import keyword to be used.
.eslintrc
{
"parserOptions": {
"sourceType": "module"
}
}
Docs: https://eslint.org/docs/user-guide/configuring#specifying-parser-options
This is old answer - 2020 year
Not sure if this is still relevant as of now.
===
Spent 30 mins - trying all solutions but dint work, so sharing this one.
The issue is seen with new react app, and in Visual Studio Code, even at this time - Apr 2020.
Create a file .eslintrc.js in the root folder (beside package.json, or beside /src/ directory)
Paste below contents in .eslintrc.js
Restart your editor, like VS Code.
Now I can see real errors, instead of those fake import/export errors.
.eslintrc.js file contents:
module.exports = {
env: {
commonjs: true,
node: true,
browser: true,
es6: true,
jest: true,
},
extends: ["eslint:recommended", "plugin:react/recommended"],
globals: {},
parser: "babel-eslint",
parserOptions: {
ecmaFeatures: {
jsx: true,
},
ecmaVersion: 2018,
sourceType: "module",
},
plugins: ["react", "import", "react-hooks"],
ignorePatterns: ["node_modules/"],
rules: {},
settings: {
react: {
version: "latest", // "detect" automatically picks the version you have installed.
},
},
};
Hope that helps.
The problem was i had installed eslint globally and locally, causing inconsistencies in SublimeLinter-contrib-eslint. I uninstalled eslint globally and SublimeLinter is working.
Closing VS code and re-open it does the trick for me...
Not sure about it but try to rename your file to .eslintrc and just use
{
"extends": "airbnb",
"plugins": ["react"]
};
Also be sure you have the required packages installed.
github.com/airbnb/javascript
The accepted answer works, however, is no longer under maintenance and the newly suggested approach is to use the version from the mono repo instead.
Installation
$ npm install eslint #babel/core #babel/eslint-parser --save-dev
# or
$ yarn add eslint #babel/core #babel/eslint-parser -D
.eslintrc.js
module.exports = {
parser: "#babel/eslint-parser",
};
Reference
i also got this error in a meteor project and i could solved it setting sourceType to "module"
more details can be found in Eslint docs:
http://eslint.org/docs/user-guide/configuring#specifying-parser-options
This config worked for me. (I am using create-react-app but applicable to any eslint project)
.eslintrc (create file in root if it doesnt exist)
{
"rules": {
"jsx-a11y/anchor-is-valid": [ "error", {
"components": [ "Link" ],
"specialLink": [ "to" ]
}]
},
"parserOptions": {
"sourceType": "module",
"ecmaVersion": 2015
}
}
The same issue occurred when creating js files within a typescript react-native project while eslint is enabled.
Changing the file type from js to ts resolved the issue.
Also, adding the .eslintrc.js file as mentioned in previous answers resolved the issue without changing the file type from js to ts.
module.exports = {
parser: "#babel/eslint-parser",
};
The issue is seen with the new react app, and in Visual Studio Code, even at this time - August 2022
Create a file .eslintrc.js in the root folder
Paste the below contents in .eslintrc.js
Restart your editor, like VS Code.
Now I can see real errors, instead of those fake import/export errors.
.eslintrc.js file contents:
export const parser = "#babel/eslint-parser";
The accepted answer works, however, the newly suggested approach is to use the version from ES6.
Adding ecmaVersion to .eslintrc.json fixed the issue
{
"ecmaVersion": 2015,
"extends": [
"eslint:recommended",
"plugin:react/recommended"
]
}
I found this issue while creating the vue project (Used Editor: Visual Code)
Install babel-eslint package
npm install babel-eslint
Create the .eslintrc.js file and add below code
module.exports = {
root: true,
parserOptions: {
'sourceType': 'module',
parser: 'babel-eslint'
}
}
npm run serve, that error will be resolved like magic.

How to ignore a particular directory or file for tslint?

The IDE being used is WebStorm 11.0.3, the tslint is configured and works, but, it hangs because it tries to parse large *.d.ts library files.
Is there a way to ignore a particular file or directory?
Update for tslint v5.8.0
As mentioned by Saugat Acharya, you can now update tslint.json CLI Options:
{
"extends": "tslint:latest",
"linterOptions": {
"exclude": [
"bin",
"lib/*generated.js"
]
}
}
More information in this pull request.
This feature has been introduced with tslint 3.6
tslint \"src/**/*.ts\" -e \"**/__test__/**\"
You can now add --exclude (or -e) see PR here.
CLI
usage: tslint [options] file ...
Options:
-c, --config configuration file
--force return status code 0 even if there are lint errors
-h, --help display detailed help
-i, --init generate a tslint.json config file in the current working directory
-o, --out output file
-r, --rules-dir rules directory
-s, --formatters-dir formatters directory
-e, --exclude exclude globs from path expansion
-t, --format output format (prose, json, verbose, pmd, msbuild, checkstyle) [default: "prose"]
--test test that tslint produces the correct output for the specified directory
-v, --version current version
you are looking at using
-e, --exclude exclude globs from path expansion
Currently using Visual Studio Code and the command to disable tslint is
/* tslint:disable */
Something to note. The disable above disables ALL tslint rules on that page. If you want to disable a specific rule you can specify one/multiple rules.
/* tslint:disable comment-format */
/* tslint:disable:rule1 rule2 rule3 etc.. */
Or enable a rule
/* tslint:enable comment-format */
More in depth on TSLint rule flags
In addition to Michael's answer, consider a second way: adding linterOptions.exclude to tslint.json
For example, you may have tslint.json with following lines:
{
"linterOptions": {
"exclude": [
"someDirectory/*.d.ts"
]
}
}
Starting from tslint v5.8.0 you can set an exclude property under your linterOptions key in your tslint.json file:
{
"extends": "tslint:latest",
"linterOptions": {
"exclude": [
"bin",
"**/__test__",
"lib/*generated.js"
]
}
}
More information on this here.
I had to use the **/* syntax to exclude the files in a folder:
"linterOptions": {
"exclude": [
"src/auto-generated/**/*",
"src/app/auto-generated/**/*"
]
},
As an addition
To disable all rules for the next line // tslint:disable-next-line
To disable specific rules for the next line: // tslint:disable-next-line:rule1 rule2...
To disable all rules for the current line: someCode(); // tslint:disable-line
To disable specific rules for the current line: someCode(); // tslint:disable-line:rule1
There are others who encountered the problem. Unfortunately, there is only an open issue for excluding files: https://github.com/palantir/tslint/issues/73
So I'm afraid the answer is no.
linterOptions is currently only handled by the CLI.
If you're not using CLI then depending on the code base you're using you'll need to set the ignore somewhere else. webpack, tsconfig, etc
Can confirm that on version tslint 5.11.0 it works by modifying lint script in package.json by defining exclude argument:
"lint": "ng lint --exclude src/models/** --exclude package.json"
Cheers!!
add the section in your code example
"linterOptions": {
"exclude": [
"node_modules/**/*.",
"db/**/*.",
"integrations/**/*."
]
},

How to use ESLint with Jest

I'm attempting to use the ESLint linter with the Jest testing framework.
Jest tests run with some globals like jest, which I'll need to tell the linter about; but the tricky thing is the directory structure, with Jest the tests are embedded with the source code in __tests__ folders, so the directory structure looks something like:
src
foo
foo.js
__tests__
fooTest.js
bar
bar.js
__tests__
barTest.js
Normally, I'd have all my tests under a single dir, and I could just add an .eslintrc file there to add the globals... but I certainly don't want to add a .eslintrc file to every single __test__ dir.
For now, I've just added the test globals to the global .eslintrc file, but since that means I could now reference jest in non-testing code, that doesn't seem like the "right" solution.
Is there a way to get eslint to apply rules based on some pattern based on the directory name, or something like that?
The docs show you are now able to add:
"env": {
"jest/globals": true
}
To your .eslintrc which will add all the jest related things to your environment, eliminating the linter errors/warnings.
You may need to include plugins: ["jest"] to your esconfig, and add the eslint-plugin-jest plugin if it still isn't working.
ESLint supports this as of version >= 4:
/*
.eslintrc.js
*/
const ERROR = 2;
const WARN = 1;
module.exports = {
extends: "eslint:recommended",
env: {
es6: true
},
overrides: [
{
files: [
"**/*.test.js"
],
env: {
jest: true // now **/*.test.js files' env has both es6 *and* jest
},
// Can't extend in overrides: https://github.com/eslint/eslint/issues/8813
// "extends": ["plugin:jest/recommended"]
plugins: ["jest"],
rules: {
"jest/no-disabled-tests": "warn",
"jest/no-focused-tests": "error",
"jest/no-identical-title": "error",
"jest/prefer-to-have-length": "warn",
"jest/valid-expect": "error"
}
}
],
};
Here is a workaround (from another answer on here, vote it up!) for the "extend in overrides" limitation of eslint config :
overrides: [
Object.assign(
{
files: [ '**/*.test.js' ],
env: { jest: true },
plugins: [ 'jest' ],
},
require('eslint-plugin-jest').configs.recommended
)
]
From https://github.com/eslint/eslint/issues/8813#issuecomment-320448724
You can also set the test env in your test file as follows:
/* eslint-env jest */
describe(() => {
/* ... */
})
To complete Zachary's answer, here is a workaround for the "extend in overrides" limitation of eslint config :
overrides: [
Object.assign(
{
files: [ '**/*.test.js' ],
env: { jest: true },
plugins: [ 'jest' ],
},
require('eslint-plugin-jest').configs.recommended
)
]
From https://github.com/eslint/eslint/issues/8813#issuecomment-320448724
As of 2021, I think the correct way or at least the one that works is to install #types/jest and eslint-plugin-jest:
npm i -D eslint-plugin-jest #types/jest
And adding the Jest plugin into .eslintrc.js with the overrides instruction mentioned by #Loren:
module.exports = {
...
plugins: ["jest"],
...
overrides: [
{
files: ["**/*.test.js"],
env: { "jest/globals": true },
plugins: ["jest"],
extends: ["plugin:jest/recommended"],
},
],
...
};
This way you get linting errors in your source files as well as in test files, but in test files you don't get linting errors for test and other Jest's functions, but you will get them in your source files as they will appear as undefined there.
I solved the problem REF
Run
# For Yarn
yarn add eslint-plugin-jest -D
# For NPM
npm i eslint-plugin-jest -D
And then add in your .eslintrc file
{
"extends": ["airbnb","plugin:jest/recommended"],
}
some of the answers assume you have eslint-plugin-jest installed, however without needing to do that, you can simply do this in your .eslintrc file, add:
"globals": {
"jest": true,
}
First install eslint-plugin-jest
Running:
yarn add eslint-plugin-jest or npm install eslint-plugin-jest
Then edit .eslintrc.json
{
"env":{
"jest": true
}
}
As of ESLint V 6 (released in late 2019), you can use extends in the glob based config as follows:
"overrides": [
{
"files": ["*.test.js"],
"env": {
"jest": true
},
"plugins": ["jest"],
"extends": ["plugin:jest/recommended"]
}
]
Add environment only for __tests__ folder
You could add a .eslintrc.yml file in your __tests__ folders, that extends you basic configuration:
extends: <relative_path to .eslintrc>
env:
jest: true
If you have only one __tests__folder, this solution is the best since it scope jest environment only where it is needed.
Dealing with many test folders
If you have more test folders (OPs case), I'd still suggest to add those files. And if you have tons of those folders can add them with a simple zsh script:
#!/usr/bin/env zsh
for folder in **/__tests__/ ;do
count=$(($(tr -cd '/' <<< $folder | wc -c)))
echo $folder : $count
cat <<EOF > $folder.eslintrc.yml
extends: $(printf '../%.0s' {1..$count}).eslintrc
env:
jest: true
EOF
done
This script will look for __tests__ folders and add a .eslintrc.yml file with to configuration shown above. This script has to be launched within the folder containing your parent .eslintrc.
Pattern based configs are scheduled for 2.0.0 release of ESLint. For now, however, you will have to create two separate tasks (as mentioned in the comments). One for tests and one for the rest of the code and run both of them, while providing different .eslintrc files.
P.S. There's a jest environment coming in the next release of ESLint, it will register all of the necessary globals.
I got it running after spending some time trying out different options. Hope this helps anyone else getting stuck.
.eslintrc.json (in root project folder):
{
"env": {
"browser": true,
"es2021": true,
"jest/globals": true
},
"extends": [
"standard",
"plugin:jest/all"
],
"parser": "#babel/eslint-parser",
"parserOptions": {
"ecmaVersion": 12,
"sourceType": "module"
},
"rules": {
"jest/no-hooks": [
"error",
{
"allow": [
"afterEach",
"beforeEach"
]
}
]
},
"plugins": [
"jest"
]
}
Empty .babelrc (in root project folder):
{}
.package.json (in root project folder):
{
"scripts": {
"test": "jest",
"lint": "npx eslint --format=table .",
"lintfix": "npx eslint --fix ."
},
"devDependencies": {
"#babel/core": "^7.15.0",
"#babel/eslint-parser": "^7.15.0",
"aws-sdk-mock": "^5.2.1",
"eslint": "^7.32.0",
"eslint-config-standard": "^16.0.3",
"eslint-plugin-import": "^2.24.0",
"eslint-plugin-jest": "^24.4.0",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-promise": "^5.1.0",
"jest": "^27.0.6"
}
}
VS Code settings.xml (editor configuration: enables auto fix on save + babel parser):
"eslint.alwaysShowStatus": true,
"eslint.format.enable": true,
"eslint.lintTask.enable": true,
"eslint.options": {
"parser": "#babel/eslint-parser"
},
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"eslint.validate": [
"javascript"
]
In your .eslintignore file add the following value:
**/__tests__/
This should ignore all instances of the __tests__ directory and their children.

Categories