Reputation: 3579

How to disable ESLint in vue-cli?

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?

Upvotes: 121

Answers (22)

laurisstepanovs

Reputation: 536

To disable Eslint for one line you can put a comment above the line you want to disable Eslint check.

// eslint-disable-next-line

To disable Eslint for the whole file you can write a comment below on top of the file.

/* eslint-disable */

To disable Eslint for one specific file or folder you can include it to .eslintignore.

.eslintignore

/src/components

Same way if you want to disable Eslint in the entire project just set the path below.

.eslintignore

**/*

To disable some specific rule check you can "off" it in .eslintrc.js.

.eslintrc.js

module.exports = {
 rules: {
    "no-console": "off",
 },
}

no-console rule will disable warnings when using console.log, you can find all available rules in Eslint and Vue Esint plugin docs.

Upvotes: 4

Sandeep Rana

Reputation: 309

You can either delete it using the command

npm remove @vue/cli-plugin-eslint

Or Disable it for a particular file by using the below command in that file's script tag

/* eslint-disable */

Upvotes: 2

Dim John

Reputation: 11

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

Upvotes: 1

Artur

Reputation: 1183

In .eslintignore, add

/*/

Lint will no longer complain

Upvotes: 2

Gabriel soft

Reputation: 563

to easily to this just uninstall using the following commands

npm remove @vue/cli-plugin-eslint
yarn remove @vue/cli-plugin-eslint

Upvotes: 1

Eric Grotke

Reputation: 5145

As of the current version (^3.0?) you can just set:

useEslint: false,

in config/index.js

Upvotes: 35

CDT

Reputation: 10671

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.

Upvotes: 5

MD SHAYON

Reputation: 8063

This should work

in vue.config.js add this

module.exports = {
    lintOnSave: false
}

Upvotes: -1

Eahiya

Reputation: 1321

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

Upvotes: 4

kiarash shamaii

Reputation: 26

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"
  ]
}

Upvotes: 0

i-wizard

Reputation: 314

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'
  }
}

Upvotes: 0

Aakash

Reputation: 23865

As of `2019, March` :

In the vue.config.js :

module.exports = {
  ...
  lintOnSave: false
  ...
}

Upvotes: 127

sfuerte

Reputation: 739

in package.json change the build step:

...
"scripts": {
    "build": "vue-cli-service build --skip-plugins @vue/cli-plugin-eslint",
    ...
},

Upvotes: 59

Nick Vasilakopoulos

Reputation: 43

Go to .eslintrc.js and add this:

dev: {
   useEslint: false
},

Upvotes: 2

ZWHmepsy

Reputation: 21

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,
    ...
  },
}

Upvotes: 2

xgqfrms

Reputation: 12216

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

Upvotes: 7

Panayiotis Hiripis

Reputation: 700

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/**"
    ]
  },

Upvotes: 3

Wossname

Reputation: 2171

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

Upvotes: 162

Santosh P

Reputation: 145

Set useEslint: false, in config/index.js

see this image

Upvotes: 1

Felix Jr

Reputation: 452

In the latest version, open the ".eslintrc.js" file, and set "root: false".

Upvotes: 10

reverie_ss

Reputation: 2704

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!

Upvotes: 7

ceejayoz

Reputation: 180176

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.

Upvotes: 16

How to disable ESLint in vue-cli?

Answers (22)

As of 2019, March :

Related Questions

As of `2019, March` :