I'm trying to install ESlint to use it with Sublime Text 2 for all my local projects. Configuration documentation is very unclear about global installation:
Note: eslint --init is intended for setting up and configuring ESLint on a per-project basis and will perform a local installation of ESLint and its plugins in the directory in which it is run. If you prefer using a global installation of ESLint, any plugins used in your configuration must also be installed globally.
I don't understand what they mean. I used eslint --init and it installed ESlint locally in node_modules, along with all plugins. There's nothing explained about installing plugins globally. How do I do that? Also, how do I use the global ESlint installation if eslint --init installs local one anyway? This is so confusing.
You can install Node modules within the project (locally) or globally. To switch to globally, you may use the -g flag, like so:
npm install -g eslint
Then see if it's working without Sublime Text (-v flag to see the version of eslint):
eslint -v
To see where it was installed (assuming MacOS/Linux):
which eslint
Then see if it's working in Sublime Text (you may need to restart Sublime first). If it's not working, make sure in the eslint package settings that the path is correct.
The assumption is that you have an eslint plugin installed for your editor,if you have then npm install -g eslint,then you can install add-ons for specific environments,like npm install eslint-config-airbnb eslint-plugin-react eslint-plugin-jsx-a11y eslint-plugin-import -g (this is support for pure JS and for React),you can on this way add support for nodejs too,in working folder make .eslintrc file which looks like this
{
"extends": ["airbnb" , "eslint:recommended"],
"env": {
"node": false,
"es6": true,
"browser": true
},
"rules": {
"semi":"error",
"no-unused-vars": "off",
"func-names":"off",
"indent":"off",
"no-else-return":"off",
"prefer-arrow-callback":"off",
"no-undef":"off",
"no-use-before-define":"off",
"comma-dangle":"off",
"eol-last":"off",
"no-trailing-spaces":"off",
"linebreak-style":"off",
"no-console":"off",
"no-restricted-globals":"off",
"object-shorthand":"off",
"no-shadow":"off",
"no-debugger":"off",
"prefer-const":"off",
"no-multiple-empty-lines":"off"
}
}
if you need node support then in env section of .eslintrc set node to 'true' and install eslint-node plugin globally too with next
npm i eslint-plugin-node -g.
Then in extends section of .eslintrc add "plugin:node/recommended".
In this way, you will have eslint support in every project on your machine which have .eslintrc file.Set rules which you need in .eslintrc rules section .
Thats it.
To install eslint globally: npm install -g eslint
To install eslint in your project folder: npm install eslint --save-dev
Add in package.json this script : "eslint": "eslint --ignore-path .gitignore ."
Create a file called .eslintrc and insert :
{
"env": {
"browser": true,
"node": true
},
"globals": {
"chrome": true
},
"rules": {
"no-console": 0,
"no-empty": [1, { "allowEmptyCatch": true }]
},
"extends": "eslint:recommended"
}
Personally, I save this file in my js folder
Go to node_modules/.bin
Run : eslint --init
or npm run eslint nameOfYourFile
Unfortunately, ESLint no longer recommends the use of Personal Configuration. Even if you have ESLint and other ESLint configuration files installed in the global scope, it will not read them correctly.
https://eslint.org/docs/latest/user-guide/configuring/configuration-files#personal-configuration-files-deprecated
Personal Configuration Files (deprecated)
⚠️ This feature has been deprecated. This feature will be removed
in the 8.0.0 release. If you want to continue to use personal
configuration files, please use the --config CLI
option.
For more information regarding this decision, please see RFC
28 and RFC
32.
~/ refers to the home directory of the current user on your
preferred operating
system. The personal
configuration file being referred to here is ~/.eslintrc.* file,
which is currently handled differently than other configuration files.
How does ESLint find personal configuration files?
If eslint could not find any configuration file in the project,
eslint loads ~/.eslintrc.* file.
If eslint could find configuration files in the project, eslint
ignores ~/.eslintrc.* file even if it's in an ancestor directory of
the project directory.
How do personal configuration files behave?
~/.eslintrc.* files behave similarly to regular configuration files,
with some exceptions:
~/.eslintrc.* files load shareable configs and custom parsers from
~/node_modules/ – similarly to require() – in the user's home
directory. Please note that it doesn't load global-installed packages.
~/.eslintrc.* files load plugins from $CWD/node_modules by default
in order to identify plugins uniquely. If you want to use plugins with
~/.eslintrc.* files, plugins must be installed locally per project.
Alternatively, you can use the --resolve-plugins-relative-to CLI
option
to change the location from which ESLint loads plugins.
Related
Given an npm workspace with the following structure
workspace
package.json
packages
package-a
package.json
package-b
package.json
When I run an install command in package-a this will generate a package-lock.json file in the root of the workspace but not in the package.json file itself.
Is there a way to also generate it in the packages?
I don't know if this solves your problem, but you can specifie the folder in which you would install with --prefix
npm install --prefix ./install/here
you can use the lerna tool to manage your workspace and install dependencies in each package. you can generate package-lock.json files in each package in your workspace.
The Original Tool for JavaScript Monorepos. Monorepo means a repository with multiple packages.
lerna.js.org
I hope this answer will show you the right direction.
In most cases, running npm install within that package directory should do the job. But as you said that this is creating a global package-lock.json. This might be because the package you are installing might be specifying the global path using the prefix field.
The "prefix" field, specifies the location where the package's dependencies should be installed.
So one thing you can do is to go to the package.json in package-a and then either remove the prefix field from the package.json file OR set its value as following :
{
"name": "my-package",
"version": "1.0.0",
"prefix": "./",
"dependencies": {
...
}
}
Now when you run npm install it should install the packages locally and make a local 'package-lock.json`.
I've been trying to use ESLint along with Standard and I haven't been able to get it to work. I've tried setting it up through eslint --init, uninstalling eslint globally and having all the packages locally, installing each package manually npm install --save-dev eslint eslint-config-standard eslint-plugin-standard eslint-plugin-promise eslint-plugin-import eslint-plugin-node, reinstalling ESLint extension and nothing so far. I'm perfectly able to run ./node_modules/.bin/eslint --fix ... in order to fix/check errors but it doesn't work with the VSCode extension by any meanings. I don't have prettier so it isn't related to it either.
Output:
[Info - 12:33:20 AM] ESLint server is running.
[Info - 12:33:23 AM] ESLint library loaded from: c:\Users\h08FXplsV8\Documents\dev\node\graphql-bootcamp\graphql-prisma\node_modules\eslint\lib\api.js
[Error - 12:33:25 AM]
Failed to load plugin 'import' declared in 'graphql-prisma\.eslintrc » eslint-config-standard': Cannot find module 'eslint-plugin-import'
Require stack:
- C:\Users\h08FXplsV8\Documents\dev\node\graphql-bootcamp\__placeholder__.js
Happened while validating C:\Users\h08FXplsV8\Documents\dev\node\graphql-bootcamp\graphql-prisma\src\resolvers\index.js
This can happen for a couple of reasons:
- The plugin name is spelled incorrectly in an ESLint configuration file (e.g. .eslintrc).
- If ESLint is installed globally, then make sure 'eslint-plugin-import' is installed globally as well.
- If ESLint is installed locally, then 'eslint-plugin-import' isn't installed correctly.
.eslintrc:
{
"env": {
"es6": true,
"node": true
},
"extends": [
"standard"
],
"globals": {
"Atomics": "readonly",
"SharedArrayBuffer": "readonly"
},
"parserOptions": {
"ecmaVersion": 2018,
"sourceType": "module"
},
"rules": {
}
}
I've seen other questions in SO related to this issue but none of the solutions worked, unfortunately.
I had the same issue for many weeks and finally found this thread and comment on Github: https://github.com/microsoft/vscode-eslint/issues/696#issuecomment-542592372
My issue turned out to be related to subdirectories. As soon as I made the project the only open project with an .eslintrc.js file, all of my linting issues went away.
Hopefully this works for you.
To fix the dependency tree, try following these steps in the exact order:
Delete package-lock.json (not package.json!) and/or yarn.lock in your project folder.
Delete node_modules in your project folder.
Remove "babel-eslint" from dependencies and/or devDependencies in the package.json file in your project folder.
Run npm install or yarn, depending on the package manager you use.
Also, be sure, that you have latest version of "eslint-plugin-import" plugin, as in my case, for example i had this error with "2.20.1" version, but latest "2.25.3" solved this issue
I had the same error caused by the eslint-plugin-import dependency and in my case, I got rid of the error by increasing to the latest version of the package.
For those having the following error with flutter firebase cloud functions after running firebase init functions and trying to run firebase deploy --only functions:
ESLint: 8.9.0
Error: Failed to load plugin 'import' declared in '.eslintrc.js': Cannot find module 'es-abstract/2021/RequireObjectCoercible'
Require stack:
- C:\Users\xx\Documents\xx\xx\functions\node_modules\eslint-plugin-import\lib\ExportMap.js
- C:\Users\xx\Documents\xx\xx\functions\node_modules\eslint-plugin-import\lib\rules\named.js
- C:\Users\xx\Documents\xx\xx\functions\node_modules\eslint-plugin-import\lib\index.js
- C:\Users\xx\Documents\xx\xx\functions\node_modules\#eslint\eslintrc\dist\eslintrc.cjs
This was solved by:
delete node_modules in functions folder
delete package-lock.json in functions folder
cd .\functions\ in the terminal to get into functions folder, run npm i, cd ../
firebase deploy --only functions
I am having this issue too which was why I checked this post but did not see any answer that work for me. After searching online, I stumbled into this code which solves my problem.
npm i -D eslint #typescript-eslint/eslint-plugin
In my case, i was not using jest at all.
So i had to downgrade de eslint dev dependency:
"eslint": "^7.32.0",
as it say here: https://github.com/eslint/eslint/issues/15149#issuecomment-939501275
I am in the process of switching my monorepo (back) from yarn (with workspaces) to lerna/npm, because yarn is too slow and unstable. However, I made an surprising discovery. With the following trivial package.json:
{
"devDependencies": { "lerna": "^2.11.0" },
"dependencies": { "typescript": "^2.9.1" }
}
and an empty lerna.json (in other words, no packages at all), then when I run
$ lerna bootstrap
it does not install anything at all in any top-level node_modules directory. And if for some reason I have a node_modules directory with no .bin subdirectory, then lerna bootstrap fails to create or populate the .bin subdirectory.
Is lerna not designed to actually specify top-level packages which are to be installed (along with their binaries in .bin)? I do notice that if I try lerna add on a lerna monorepo with no packages, it complains that "lerna WARN No packages found in scope where tslint can be added."
I could not find anything related to this in the documentation. With yarn/workspaces, I was using the ability to install global (top-level) versions of things like TypeScript for use in my build scripts while maintaining control over the version installed.
From the Lerna docs:
You can add the root as a managed location (in the packages array of lerna.json) - if that's something you need. This would cause lerna to link root's dependencies to your packages' directories, run postinstall script along with the others, etc.
I have created project my-npm-lib and published it with npm.
Now I have an another project where I want to do:
npm install my-npm-lib --save
But if I do so, it always add to dependencies:
"dependencies": {
"my-npm-lib": "file:..\\my-npm-lib"
}
This is actually correct because I have the my-npm-lib project located there on the device where I do this.
But this is something I don't want to. Later in my new project I use the webpack and I need to do:
include: [
path.resolve(__dirname, "src"),
path.resolve(__dirname, "node_modules/my-npm-lib")
],
which
is impossible now because the module is not located in node_modules,
doesn't allow me to share the new project correctly with other associates, because there is a wrong path in the package.json file.
So far I have tried to rewrite the package.json manually with
"dependencies": {
"my-npm-lib": "^1.0.0"
}
and then use npm install, but it didn't install this particular module.
PS: Im quite sure my-npm-lib is working with npm, because it is working on other device. It seems there is a problem only with the device where the my-npm-lib is being developed.
I have found the solution,
be sure that package.json dependencies has a correct structure,
use npm install my-npm-lib --save,
then rewrite the "file:..\\my-npm-lib" to "^1.0.0",
delete the package-lock.json!, (it was the missing piece)
cast npm install again.
I created a project with npm and vuejs/vue-cli.
I imported the ESLint extension.
I have eslint entries in my package.json file.
Now when I format my code (right-click, Format Code), it completely disfigures my code.
What do I have to do to get vscode to format according to the ESLint rules?
But on the website, ESLint complains that everything is not formatted correctly, and so it is obviously installed and running in some sense:
1) First, you need to install the ESLint extension in the VS code.
This extension uses the ESLint library.If you haven't installed ESLint either locally or globally do so by running
npm install eslint //For a local install
or
npm install -g eslint //For a global install.
2) Then, open Setting.json file in VS code. by
File-> Preferences->Settings.
3) Add following setting.
{
"eslint.enable": true,
"eslint.autoFixOnSave": true,
"eslint.run": "onType",
"eslint.options": {
"extensions": [".js",".vue"]
},
"eslint.validate": [
{ "language": "vue", "autoFix": true }
]
}
4) Now, check your vue file.It will start showing linting error.If not, restart the VS code.
I met this problem before.
I resolved it by installing eslint using npm install locally(it can be installed globally), then run "eslint --init", restart vscode.
Hope this help you.