Eslint-plugin-vue: Not compatible with typescript-eslint

[forresthopkinsa]

Tell us about your environment

• ESLint version: 5.13.0
• eslint-plugin-vue version: 5.1.0
• Node version: 6.7.0

Please show your full configuration:

module.exports = {
  root: true,
  parserOptions: {
    parser: "@typescript-eslint/parser",
  },
  env: {
    browser: true,
  },
  extends: [
    "plugin:vue/recommended",
    "@vue/prettier",
    "@vue/typescript",
    "plugin:prettier/recommended",
    "plugin:@typescript-eslint/recommended",
  ],
  // required to lint *.vue files
  plugins: [
    "vue",
    "@typescript-eslint"
  ],
  // add your custom rules here
  rules: {
    // allow async-await
    "generator-star-spacing": "off",
    // allow debugger during development
    "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off",
    "no-console": process.env.NODE_ENV === "production" ? "error" : "off",
  }
}

What did you do?
Added typescript-eslint plugin so that I could get linting support for non-vue .ts files

What did you expect to happen?
Expected Vue files to still be linted as usual, but now with .ts files also being linted

What actually happened?

> [email protected] lint /Users/forrest.hopkins/Documents/projects/braze/src/frontend
> eslint --ext .js,.vue src test/unit test/e2e/specs


/Users/forrest.hopkins/Documents/projects/braze/src/frontend/src/App.vue
  5:39  error  Parsing error: Identifier expected

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/src/components/AddBtn.vue
  2:46  error  Parsing error: Identifier expected

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/src/components/AddDialog.vue
  2:11  error  Parsing error: Identifier expected

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/src/components/DataTable.vue
  3:2  error  Parsing error: Identifier expected

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/src/components/ExpandDetails.vue
  3:21  error  Parsing error: Identifier expected

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/src/components/IncludedList.vue
  4:37  error  Parsing error: Identifier expected

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/src/components/ModTable.vue
  6:4  error  Parsing error: Identifier expected

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/src/components/PackTable.vue
  6:4  error  Parsing error: Identifier expected

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/src/components/PackVersionDialog.vue
  2:11  error  Parsing error: Identifier expected

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/src/components/RootCard.vue
  9:8  error  Parsing error: Identifier expected

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/src/components/Snackbar.vue
  2:37  error  Parsing error: Identifier expected

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/test/unit/jest.conf.js
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-duplicate-attributes
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-template-key
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-textarea-mustache
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-unused-components
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-unused-vars
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-use-v-if-with-v-for
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/require-component-is
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/require-v-for-key
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/use-v-on-exact
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-bind
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-cloak
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-else-if
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-else
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-for
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-html
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-if
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-model
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-on
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-once
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-pre
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-show
   1:1   error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-text
   1:1   warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/attribute-hyphenation
   1:1   warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-template-shadow
   1:1   warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/v-bind-style
   1:1   warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/v-on-style
   1:1   warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/attributes-order
   1:1   warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-v-html
   1:1   warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/this-in-template
   1:14  error    Require statement not part of import statement                                                                                                       @typescript-eslint/no-var-requires
   4:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
   5:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
   6:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
   7:1   error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
   8:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
   9:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
  10:1   error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
  11:1   error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
  12:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
  13:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
  14:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
  15:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
  16:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
  17:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
  18:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
  19:1   error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
  20:1   error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
  21:1   error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
  22:1   error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
  23:1   error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/test/unit/setup.js
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-duplicate-attributes
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-template-key
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-textarea-mustache
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-unused-components
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-unused-vars
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-use-v-if-with-v-for
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/require-component-is
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/require-v-for-key
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/use-v-on-exact
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-bind
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-cloak
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-else-if
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-else
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-for
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-html
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-if
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-model
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-on
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-once
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-pre
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-show
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-text
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/attribute-hyphenation
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-template-shadow
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/v-bind-style
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/v-on-style
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/attributes-order
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-v-html
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/this-in-template

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/test/unit/specs/HelloWorld.spec.js
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-duplicate-attributes
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-template-key
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-textarea-mustache
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-unused-components
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-unused-vars
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-use-v-if-with-v-for
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/require-component-is
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/require-v-for-key
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/use-v-on-exact
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-bind
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-cloak
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-else-if
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-else
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-for
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-html
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-if
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-model
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-on
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-once
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-pre
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-show
  1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-text
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/attribute-hyphenation
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-template-shadow
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/v-bind-style
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/v-on-style
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/attributes-order
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-v-html
  1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/this-in-template
  5:1  error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
  6:1  error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
  7:1  error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
  8:1  error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
  9:1  error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent

/Users/forrest.hopkins/Documents/projects/braze/src/frontend/test/e2e/specs/test.js
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-duplicate-attributes
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-template-key
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-textarea-mustache
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-unused-components
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-unused-vars
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-use-v-if-with-v-for
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/require-component-is
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/require-v-for-key
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/use-v-on-exact
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-bind
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-cloak
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-else-if
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-else
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-for
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-html
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-if
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-model
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-on
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-once
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-pre
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-show
   1:1  error    Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/valid-v-text
   1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/attribute-hyphenation
   1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-template-shadow
   1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/v-bind-style
   1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/v-on-style
   1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/attributes-order
   1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/no-v-html
   1:1  warning  Use the latest vue-eslint-parser. See also https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error  vue/this-in-template
   5:1  error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent
   6:1  error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
   7:1  error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
   8:1  error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
   9:1  error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
  11:1  error    Expected indentation of 8 spaces but found 2 tabs                                                                                                    @typescript-eslint/indent
  12:1  error    Expected indentation of 12 spaces but found 3 tabs                                                                                                   @typescript-eslint/indent
  13:1  error    Expected indentation of 12 spaces but found 3 tabs                                                                                                   @typescript-eslint/indent
  14:1  error    Expected indentation of 12 spaces but found 3 tabs                                                                                                   @typescript-eslint/indent
  15:1  error    Expected indentation of 12 spaces but found 3 tabs                                                                                                   @typescript-eslint/indent
  16:1  error    Expected indentation of 12 spaces but found 3 tabs                                                                                                   @typescript-eslint/indent
  17:1  error    Expected indentation of 12 spaces but found 3 tabs                                                                                                   @typescript-eslint/indent
  18:1  error    Expected indentation of 4 spaces but found 1 tab                                                                                                     @typescript-eslint/indent

✖ 166 problems (138 errors, 28 warnings)
  38 errors and 0 warnings potentially fixable with the `--fix` option.

And the erroneous Vue lint errors go away as soon as I remove "plugin:@typescript-eslint/recommended" from the extends block. Of course, if I do that, then I lose linting support for my .ts files.

Here is my package.json.

[armano2]

https://vuejs.github.io/eslint-plugin-vue/user-guide/#what-is-the-use-the-latest-vue-eslint-parser-error
https://vuejs.github.io/eslint-plugin-vue/user-guide/#how-to-use-custom-parser

  "parser": "vue-eslint-parser",
  "parserOptions": {
     "parser": "@typescript-eslint/parser",
  }

[forresthopkinsa]

Naturally, I tried that, but it completely overrides the typescript-eslint parser and has the same effect as removing plugin:@typescript-eslint/recommended completely.

[armano2]

both plugins applies default parser, vue parser has option to set up additional parser in parserOptions

you can keep plugins but you have to specify both parsers (override what plugins are setting)

 "parser": "vue-eslint-parser",
  "parserOptions": {
     "parser": "@typescript-eslint/parser",
  }

i' using this in few projects and its working fine.

[forresthopkinsa]

I don't know what to tell you man, it's definitely not working fine for me. Does anything else in my eslintrc stick out to you?

[armano2]

module.exports = {
  root: true,
+ parser: "vue-eslint-parser",
  parserOptions: {
    parser: "@typescript-eslint/parser",
  },
  env: {
    browser: true,
  },
  extends: [
+   "plugin:@typescript-eslint/recommended",
    "plugin:vue/recommended",
    "@vue/prettier",
    "plugin:prettier/recommended",
    "@vue/typescript",
-   "plugin:@typescript-eslint/recommended",
  ],
  // required to lint *.vue files
  plugins: [
    "vue",
    "@typescript-eslint"
  ],
  // add your custom rules here
  rules: {
    // allow async-await
    "generator-star-spacing": "off",
    // allow debugger during development
    "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off",
    "no-console": process.env.NODE_ENV === "production" ? "error" : "off",
  }
}

[armano2]

@vue/typescript sets parsers,
plugin:vue/recommended sets parser
plugin:@typescript-eslint/recommended sets parsers

as far as i remmember order of configs in your case is important, and you can remove parser and parserOptions and it should still work if you are using cli > 3.4,

i added fix for it there https://github.com/vuejs/vue-cli/commit/189ea5440208735549b9d5c4df28280fb7a5bced

let me know if this helped

[forresthopkinsa]

Still doesn't work, .ts files aren't parsed:

module.exports = {
  root: true,
  env: {
    browser: true,
  },
  extends: [
    "plugin:@typescript-eslint/recommended",
    "plugin:vue/recommended",
    "@vue/prettier",
    "@vue/typescript",
    "plugin:prettier/recommended",
  ],
  // required to lint *.vue files
  plugins: [
    "vue",
    "@typescript-eslint"
  ],
  // add your custom rules here
  rules: {
    // allow async-await
    "generator-star-spacing": "off",
    // allow debugger during development
    "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off",
    "no-console": process.env.NODE_ENV === "production" ? "error" : "off",
  }
}

[armano2]

errors are gone?

now its not parsing ts files

you should try running eslint with --ext set

eslint ./src/ --ext .vue,.js,.ts

[forresthopkinsa]

Hmm I think we're getting somewhere, I'll have to come back to this later today

[forresthopkinsa]

Ok so I can't specify it with --ext because I need my IDE to recognize it too (among other problems with doing it that way)

I can simplify my config down to just this:

module.exports = {
  root: true,
  env: {
    browser: true,
  },
  extends: [
    "plugin:@typescript-eslint/recommended",
    "@vue/typescript",
    "plugin:vue/essential"
  ],
  plugins: [
    "vue",
    "@typescript-eslint"
  ]
}

If I remove any of the extends elements, linting breaks; otherwise, linting passes.

However, I don't get .ts file linting.

If I move typescript-eslint to be after vue/essential then I do get TS linting -- but then, Vue linting stops working.

[armano2]

you need ext, what IDE you are using? in vscode it should work,

in Intelij Idea / Webstorm -> you should add --ext .ts,.js,.vue temporarly till next major release (its already working with EAP)

in atom its working with no issues

[armano2]

you can also try to use overrides and enable and change parser for ts files

{
  ....
  "overrides": [
    {
      "files": [
        "*.ts"
      ],
      "parser": "@typescript-eslint/parser"
    }
  ]
}

[forresthopkinsa]

I am using IntelliJ EAP. But I'll try the override+parser idea.

[forresthopkinsa]

I get pretty close with an override:

module.exports = {
  root: true,
  env: {
    browser: true,
  },
  extends: [
    "plugin:@typescript-eslint/recommended",
    "@vue/typescript",
    "plugin:vue/essential"
  ],
  plugins: [
    "vue",
    "@typescript-eslint"
  ],
  overrides: {
    files: ["*.ts"],
    parser: "@typescript-eslint/parser"
  }
}

But then I start getting the Use the latest vue-eslint-parser error on all my .ts files.

[forresthopkinsa]

Here's how I ended up resolving this problem:

First, I put all my Vue components in one directory, separate from everything else. Then, I was able to make two separate eslintrc files.

I put this one in the root of the project:

module.exports = {
  root: true,
  env: {
    browser: true,
  },
  parserOptions: {
    project: './tsconfig.json',
  },
  extends: [
    'airbnb-base',
    'plugin:@typescript-eslint/recommended',
    'plugin:prettier/recommended',
    'prettier',
    'prettier/@typescript-eslint',
  ],
  plugins: ['@typescript-eslint', 'prettier'],
  rules: {
    // allow async-await
    'generator-star-spacing': 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
    'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
  },
  settings: {
    'import/resolver': {
      webpack: {
        config: 'build/webpack.base.conf.js',
      },
    },
  },
};

...and I put this one in the Vue components directory:

module.exports = {
  extends: ['plugin:vue/recommended', '@vue/typescript', 'prettier/vue'],
  plugins: ['vue', 'prettier'],
};

and voila, problem solved. Not the _most_ optimal solution, but it works well.

[riddla]

@forresthopkinsa, the following ESLint configuration does work for me (linting *.ts as well as *.vue):

module.exports = {
  root: true,
  env: {
    node: true
  },
  extends: [
    'prettier',
    'plugin:@typescript-eslint/recommended',
    'prettier/@typescript-eslint',
    'plugin:prettier/recommended',
    'plugin:vue/recommended',
    '@vue/prettier',
    '@vue/typescript'
  ],
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
  }
};

[heavenkiller2018]

@forresthopkinsa, the following ESLint configuration does work for me (linting *.ts as well as *.vue): I followed your instruction, but it is still that *.vue but *.ts can be eslinted.

@armano2
and if the directory contains .vue and .ts files together, how to handle it ?

[heavenkiller2018]

@@forresthopkinsa @@armano2
the following ESLint configuration does work for me (linting *.ts as well as *.vue):

module.exports = {
  extends: [
    'prettier/@typescript-eslint',
    'plugin:prettier/recommended',
    'plugin:vue/base',
    'prettier',
    'prettier/vue',
  ],
  parserOptions: {
    parser: '@typescript-eslint/parser',
    ecmaVersion: 2018,
    sourceType: 'module',
  },
};