vue-eslint-parser

The ESLint custom parser for `.vue` files.

vue-eslint-parser

npm version Downloads/month Build Status Coverage Status Dependency Status

The ESLint custom parser for .vue files.

ESLint supports autofix on custom parsers but does not support autofix on plugins which have processors (eslint/eslint#7510). The motivation of this custom parser is that it supports autofix on .vue files.

:cd: Installation

$ npm install --save-dev eslint vue-eslint-parser
  • vue-eslint-parser requires ESLint 3.9.0 or later.

:book: Usage

  1. Write parser option in your .eslintrc.* file.
  2. Use glob patterns or --ext .vue CLI option.
{
    "extends": "eslint:recommended",
    "parser": "vue-eslint-parser"
}
$ eslint "src/**/*.{js,vue}"
# or
$ eslint src --ext .vue

:wrench: Options

parserOptions has the same properties as what espree, the default parser of ESLint, is supporting.
For example:

{
    "parser": "vue-eslint-parser",
    "parserOptions": {
        "sourceType": "module",
        "ecmaVersion": 2017,
        "ecmaFeatures": {
            "globalReturn": false,
            "impliedStrict": false,
            "jsx": false,
            "experimentalObjectRestSpread": false
        }
    }
}

Also, you can use parser property to specify a custom parser to parse <script> tags. Other properties than parser would be given to the specified parser.
For example:

{
    "parser": "vue-eslint-parser",
    "parserOptions": {
        "parser": "babel-eslint",
        "sourceType": "module",
        "allowImportExportEverywhere": false
    }
}
{
    "parser": "vue-eslint-parser",
    "parserOptions": {
        "parser": "typescript-eslint-parser"
    }
}

:warning: Known Limitations

Some rules make warnings due to the outside of <script> tags. Please disable those rules for .vue files as necessary.

:newspaper: Changelog

:muscle: Contributing

Welcome contributing!

Please use GitHub’s Issues/PRs.

Development Tools

  • npm test runs tests and measures coverage.
  • npm run coverage shows the coverage result of npm test command with the default browser.
  • npm run clean removes the coverage result of npm test command.
  • npm run lint runs ESLint.
  • npm run watch runs tests with --watch option.

Related Repositories

vue-eslint-parser

vue-eslint-parser

The ESLint custom parser for `.vue` files. ...