Skip to content
David Graham edited this page Jun 26, 2018 · 13 revisions

Configure

The .eslintrc.js file holds the configuration for the linter. Most projects I've seen prefer the Standard preset (a.k.a. the one without semi-colons) so I selected that for this project (from the Vue-cli).

eslintrc.js

// http://eslint.org/docs/user-guide/configuring

module.exports = {
  root: true,
  parserOptions: {
    parser: 'babel-eslint',
    sourceType: 'module'
  },
  env: {
    browser: true,
    jest: true
  },
  globals: {
    utils: true
  },
  // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
  // https://github.com/vuejs/eslint-plugin-vue
  extends: [
    'standard',
    'plugin:vue/recommended'
  ],
  // required to lint *.vue files
  plugins: [
    'vue'
  ],
  // add your custom rules here
  'rules': {
    // allow paren-less arrow functions
    'arrow-parens': 0,
    // allow async-await
    'generator-star-spacing': 0,
    // allow debugger during development
    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
  }
}

Recommended Vue Rules

Vue also has some recommended rules that you can add via the eslint-plugin-vue (which I've added to the package.json for this project):

$ npm install eslint-plugin-vue --save-dev 

Visual Studio Code

Make sure you have added the ESLint extension for VS Code. You also need to add Vue to the eslint.validate setting in your .vscode/settings.json file. See the Visual Studio Code page of this wiki for more info.

Ignore File

You can tell ESLint to ignore specific files and directories by using an .eslintignore file in your project's root directory. The ignore pattern works just like .gitignore does:

build/*.js
config/*.js

Clone this wiki locally