Vetur

# Linting / Error Checking

Vetur provides error-checking and linting.

# Error Checking

Vetur has error checking for the following languages:

  • <template>: html
  • <style>: css, scss, less
  • <script>: js, ts

You can selectively turn error checking off by vetur.validation.[template/style/script].

# Linting

Vetur bundles eslint-plugin-vue (opens new window) for template error checking. By default, Vetur loads the vue/essential (opens new window) ruleset for Vue 2 projects and vue3-essential (opens new window) ruleset for Vue 3 projects.

If you want to config ESLint rules, do the following:

  • Turn off Vetur's template validation with vetur.validation.template: false
  • Make sure you have the ESLint plugin (opens new window). The errors will come from ESLint plugin, not Vetur.
  • yarn add -D eslint eslint-plugin-vue in your workspace root
  • Set ESLint rules in .eslintrc. For example:
    {
  "extends": [
    "eslint:recommended",
    "plugin:vue/recommended"
  ],
  "rules": {
    "vue/html-self-closing": "off"
  }
}

You can also checkout Veturpack (opens new window) to see how to setup eslint-plugin-vue.

# Linting TypeScript

TSLint is not available yet. We do look forward to including it. See #170 (opens new window).

Meanwhile, TS compiler errors will be shown.

← Formatting →