This repository has been archived on 2020-11-02. You can view files and clone it, but cannot push or open issues or pull requests.
TripSit_Suite/node_modules/vue-eslint-parser
2020-11-01 22:46:04 +00:00
..
node_modules Initial comission of TheLounge base files 2020-11-01 22:46:04 +00:00
index.d.ts Initial comission of TheLounge base files 2020-11-01 22:46:04 +00:00
index.js Initial comission of TheLounge base files 2020-11-01 22:46:04 +00:00
index.js.map Initial comission of TheLounge base files 2020-11-01 22:46:04 +00:00
LICENSE Initial comission of TheLounge base files 2020-11-01 22:46:04 +00:00
package.json Initial comission of TheLounge base files 2020-11-01 22:46:04 +00:00
README.md Initial comission of TheLounge base files 2020-11-01 22:46:04 +00:00

vue-eslint-parser

npm version Downloads/month Build Status Coverage Status Dependency Status

The ESLint custom parser for .vue files.

⤴️ Motivation

This parser allows us to lint the <template> of .vue files. We can make mistakes easily on <template> if we use complex directives and expressions in the template. This parser and the rules of eslint-plugin-vue would catch some of the mistakes.

💿 Installation

$ npm install --save-dev eslint vue-eslint-parser
  • Requires Node.js 6.5.0 or later.
  • Requires ESLint 5.0.0 or later.
  • Requires babel-eslint 8.1.1 or later if you want it. (optional)
  • Requires @typescript-eslint/parser 1.0.0 or later if you want it. (optional)

📖 Usage

  1. Write parser option into 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

🔧 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": 2018,
        "ecmaFeatures": {
            "globalReturn": false,
            "impliedStrict": false,
            "jsx": false
        }
    }
}

parserOptions.parser

You can use parserOptions.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"
    }
}

If the parserOptions.parser is false, the vue-eslint-parser skips parsing <script> tags completely. This is useful for people who use the language ESLint community doesnt provide custom parser implementation.

🎇 Usage for custom rules / plugins

  • This parser provides parserServices to traverse <template>.
    • defineTemplateBodyVisitor(templateVisitor, scriptVisitor) … returns ESLint visitor to traverse <template>.
    • getTemplateBodyTokenStore() … returns ESLint TokenStore to get the tokens of <template>.
    • getDocumentFragment() … returns the root VDocumentFragment.
  • ast.md is <template> AST specification.
  • mustache-interpolation-spacing.js is an example.

⚠️ Known Limitations

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

📰 Changelog

🍻 Contributing

Welcome contributing!

Please use GitHubs Issues/PRs.

If you want to write code, please execute npm install && npm run setup after you cloned this repository. The npm install command installs dependencies. The npm run setup command initializes ESLint as git submodules for tests.

Development Tools

  • npm test runs tests and measures coverage.
  • npm run build compiles TypeScript source code to index.js, index.js.map, and index.d.ts.
  • npm run coverage shows the coverage result of npm test command with the default browser.
  • npm run clean removes the temporary files which are created by npm test and npm run build.
  • npm run lint runs ESLint.
  • npm run setup setups submodules to develop.
  • npm run update-fixtures updates files in test/fixtures/ast directory based on test/fixtures/ast/*/source.vue files.
  • npm run watch runs build, update-fixtures, and tests with --watch option.