How do I go about disabling ESlint
in project generated with vue-cli
?
preLoaders: [
{
test: /\.vue$/,
loader: 'eslint',
include: projectRoot,
exclude: /node_modules/
},
{
test: /\.js$/,
loader: 'eslint',
include: projectRoot,
exclude: /node_modules/
}
]
If I remove the loader: 'eslint'
line it won't compile, same with setting it to an empty string. I know I can opt out of ESLint
during the initialization phase, but how can I disable it after my project has been created?
{{#lint}}
blocks in github.com/vuejs-templates/webpack/blob/… - can probably drop the entire preLoaders
block?
There are some out-of-date answers here.
Because vue-cli 3 is using a zero configuration approach, the way to disable it is to just uninstall the module:
npm remove @vue/cli-plugin-eslint
As of 2019, March :
In the vue.config.js
:
module.exports = {
...
lintOnSave: false
...
}
vue-cli-service lint
command when you want it.
in package.json
change the build step:
...
"scripts": {
"build": "vue-cli-service build --skip-plugins @vue/cli-plugin-eslint",
...
},
As of the current version (^3.0?) you can just set:
useEslint: false,
in config/index.js
npm run dev
again after doing changes to config
@vue/cli-plugin-eslint
module from my project
Vue's starter projects are themselves built with a templating language.
Looking at the templates (the {{#lint}}
bits) it appears you can remove the entire preLoaders
block.
src/*.js
didn't help to disable eslint for src file ... may be needed to take some extra steps? @BillCriswell
src/**/*.js
and src/**/*.vue
to ignore files recursively
https://i.stack.imgur.com/s8PVB.jpg
root
only tells ESLint that all the rules from parent folder should be dismissed.
There's a hell lot of solutions here: https://github.com/vuejs-templates/webpack/issues/73
However the best one is :
To add a line of **/*
to .eslintignore, which will ignore all files. And then re-run, if it's a web app!
One of the most simple way is just setting an .eslintignore
file with you want to disabled folders & files.
demo
/build/
/config/
/dist/
/*.js
/test/unit/coverage/
/000-xyz/
Ref: https://github.com/vuejs-templates/webpack/issues/73#issuecomment-355149342
For Vue cli v4 and project created with eslint feature selected, there's a eslintConfig
property in package.json:
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/vue3-essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
},
extends
specifies some rule presets and default is plugin:vue/vue3-essential
and eslint:recommended
. Common rules like unused variables or unused imports are in eslint:recommended
. If you want to disable such rules, just remove eslint:recommended
in eslintConfig
and restart the project, but don't remove plugin:vue/vue3-essential
otherwise linter will not be able to recognise .vue
files.
At first you need to create a file name of
vue.config.js
then write bellow line
module.exports = {
...
lintOnSave: false
...
}
This process worked for me. Thanks
Go inside file "tslint.json" and exclude all files in linterOptions. Default settings only excludes folder node_modules. You may also set "strict": false, inside tsconfig.json
"linterOptions": {
"exclude": [
"*/**"
]
},
instead of
"linterOptions": {
"exclude": [
"node_modules/**"
]
},
setEslint: false
work for me!
module.exports = {
dev: {
...
// Use Eslint Loader?
// If true, your code will be linted during bundling and
// linting errors and warnings will be shown in the console.
useEslint: false,
...
},
}
setEslint
or useEslint
?
Go to .eslintrc.js
and add this:
dev: {
useEslint: false
},
For vue3 users, just comment out the parserOptions in the eslintrc.js file. it works for me cos sometimes linting can become frustrating
module.exports = {
root: true,
env: {
node: true
},
'extends': [
'plugin:vue/vue3-essential',
'eslint:recommended'
],
// parserOptions: {
// parser: 'babel-eslint'
// },
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
}
}
in vueCli go to package json remove eslint from dependencies at end your package json must like this
{ "name": "vuecompesation", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build" }, "dependencies": { "core-js": "^3.6.5", "vue": "^3.0.0" }, "devDependencies": { "@vue/cli-plugin-babel": "~4.5.0", "@vue/cli-plugin-eslint": "~4.5.0", "@vue/cli-service": "~4.5.0", "@vue/compiler-sfc": "^3.0.0", "babel-eslint": "^10.1.0" }, "eslintConfig": { "root": true, "env": { "node": true }, "extends": [ "plugin:vue/vue3-essential", "eslint:recommended" ], "parserOptions": { "parser": "babel-eslint" }, "rules": {} }, "browserslist": [ "> 1%", "last 2 versions", "not dead" ] }
to easily to this just uninstall using the following commands
npm remove @vue/cli-plugin-eslint
yarn remove @vue/cli-plugin-eslint
In .eslintignore
, add
/*/
Lint will no longer complain
I personaly in order to get over that problem, created a new project and manually emited the Linter / Formatter option from the setup
i dont solve the problem i just try avoid it. Hope this helps someone
This should work
in vue.config.js add this
module.exports = {
lintOnSave: false
}
Success story sharing
@vue/cli-plugin-eslint
and now the commandvue-cli-service serve
saysError: Cannot find module '@vue/cli-plugin-eslint'
. What else is needed?