title: Why Eslint don't see global TypeScript types in .vue files (no-undef)
body: <p>I have a global type in my Vue/TypeScript project. In the <code>.ts</code> files, everything is fine, and Eslint sees it, but in the <code>.vue</code> files, Eslint throws error that the type is not defined. TypeScript does not throw any errors and sees this type. Configs and code sample below.</p>
  <p><strong>package.json</strong></p>
  <pre class="lang-json prettyprint-override"><code>{
    &quot;dependencies&quot;: {
      &quot;@hse-design/core&quot;: &quot;^1.1.0&quot;,
      &quot;@hse-design/vue&quot;: &quot;^1.1.0&quot;,
      &quot;axios&quot;: &quot;^0.21.1&quot;,
      &quot;cors&quot;: &quot;^2.8.5&quot;,
      &quot;element-ui&quot;: &quot;^2.12.0&quot;,
      &quot;faker&quot;: &quot;^5.1.0&quot;,
      &quot;focus-visible&quot;: &quot;^5.2.0&quot;,
      &quot;js-cookie&quot;: &quot;^2.2.1&quot;,
      &quot;lodash&quot;: &quot;^4.17.20&quot;,
      &quot;morgan&quot;: &quot;^1.10.0&quot;,
      &quot;nprogress&quot;: &quot;^0.2.0&quot;,
      &quot;path-to-regexp&quot;: &quot;^6.2.0&quot;,
      &quot;register-service-worker&quot;: &quot;^1.6.2&quot;,
      &quot;sanitize.css&quot;: &quot;^12.0.1&quot;,
      &quot;vue&quot;: &quot;^2.6.10&quot;,
      &quot;vue-class-component&quot;: &quot;^7.2.6&quot;,
      &quot;vue-property-decorator&quot;: &quot;^9.1.2&quot;,
      &quot;vue-router&quot;: &quot;^3.1.2&quot;,
      &quot;vue-svgicon&quot;: &quot;^3.2.6&quot;,
      &quot;vuex&quot;: &quot;^3.1.1&quot;,
      &quot;vuex-class&quot;: &quot;^0.3.2&quot;,
      &quot;vuex-module-decorators&quot;: &quot;^1.0.1&quot;,
      &quot;yamljs&quot;: &quot;^0.3.0&quot;
    },
    &quot;devDependencies&quot;: {
      &quot;@babel/plugin-proposal-optional-chaining&quot;: &quot;^7.12.7&quot;,
      &quot;@babel/preset-typescript&quot;: &quot;^7.13.0&quot;,
      &quot;@types/compression&quot;: &quot;^1.7.0&quot;,
      &quot;@types/cors&quot;: &quot;^2.8.8&quot;,
      &quot;@types/faker&quot;: &quot;^5.1.4&quot;,
      &quot;@types/jest&quot;: &quot;^26.0.21&quot;,
      &quot;@types/js-cookie&quot;: &quot;^2.2.2&quot;,
      &quot;@types/lodash&quot;: &quot;^4.14.165&quot;,
      &quot;@types/morgan&quot;: &quot;^1.9.2&quot;,
      &quot;@types/node&quot;: &quot;~14.14.35&quot;,
      &quot;@types/nprogress&quot;: &quot;^0.2.0&quot;,
      &quot;@types/webpack-env&quot;: &quot;^1.14.0&quot;,
      &quot;@types/yamljs&quot;: &quot;^0.2.31&quot;,
      &quot;@typescript-eslint/eslint-plugin&quot;: &quot;^4.22.1&quot;,
      &quot;@typescript-eslint/parser&quot;: &quot;^4.22.1&quot;,
      &quot;@vue/cli-plugin-babel&quot;: &quot;^4.5.12&quot;,
      &quot;@vue/cli-plugin-e2e-cypress&quot;: &quot;^4.5.12&quot;,
      &quot;@vue/cli-plugin-eslint&quot;: &quot;^4.5.12&quot;,
      &quot;@vue/cli-plugin-pwa&quot;: &quot;^4.5.12&quot;,
      &quot;@vue/cli-plugin-typescript&quot;: &quot;^4.5.12&quot;,
      &quot;@vue/cli-plugin-unit-jest&quot;: &quot;^4.5.12&quot;,
      &quot;@vue/cli-service&quot;: &quot;^4.5.12&quot;,
      &quot;@vue/eslint-config-standard&quot;: &quot;^6.0.0&quot;,
      &quot;@vue/eslint-config-typescript&quot;: &quot;^7.0.0&quot;,
      &quot;@vue/test-utils&quot;: &quot;^1.0.0-beta.29&quot;,
      &quot;babel-core&quot;: &quot;^7.0.0-bridge.0&quot;,
      &quot;babel-eslint&quot;: &quot;^10.0.3&quot;,
      &quot;babel-loader&quot;: &quot;^8.2.2&quot;,
      &quot;concurrently&quot;: &quot;^6.0.0&quot;,
      &quot;core-js&quot;: &quot;^3.12.0&quot;,
      &quot;eslint&quot;: &quot;^7.25.0&quot;,
      &quot;eslint-config-airbnb-base&quot;: &quot;^14.2.1&quot;,
      &quot;eslint-plugin-import&quot;: &quot;^2.22.1&quot;,
      &quot;eslint-plugin-node&quot;: &quot;^11.1.0&quot;,
      &quot;eslint-plugin-promise&quot;: &quot;^4.3.1&quot;,
      &quot;eslint-plugin-standard&quot;: &quot;^5.0.0&quot;,
      &quot;eslint-plugin-vue&quot;: &quot;^7.9.0&quot;,
      &quot;fibers&quot;: &quot;^5.0.0&quot;,
      &quot;jest&quot;: &quot;^26.6.3&quot;,
      &quot;sass&quot;: &quot;^1.22.10&quot;,
      &quot;sass-loader&quot;: &quot;10.1.1&quot;,
      &quot;style-resources-loader&quot;: &quot;^1.2.1&quot;,
      &quot;swagger-routes-express&quot;: &quot;^3.2.1&quot;,
      &quot;ts-jest&quot;: &quot;^26.5.4&quot;,
      &quot;ts-node-dev&quot;: &quot;^1.0.0&quot;,
      &quot;typescript&quot;: &quot;^4.2.3&quot;,
      &quot;vue-cli-plugin-element&quot;: &quot;^1.0.1&quot;,
      &quot;vue-cli-plugin-style-resources-loader&quot;: &quot;^0.1.3&quot;,
      &quot;vue-template-compiler&quot;: &quot;^2.6.10&quot;,
      &quot;webpack&quot;: &quot;^5.28.0&quot;
    }
  }
  </code></pre>
  <p><strong>tsconfig.json</strong></p>
  <pre class="lang-json prettyprint-override"><code>{
    &quot;compilerOptions&quot;: {
      &quot;module&quot;: &quot;ESNext&quot;,
      &quot;target&quot;: &quot;ESNext&quot;,
      &quot;strict&quot;: true,
      &quot;jsx&quot;: &quot;preserve&quot;,
      &quot;importHelpers&quot;: true,
      &quot;moduleResolution&quot;: &quot;node&quot;,
      &quot;experimentalDecorators&quot;: true,
      &quot;emitDecoratorMetadata&quot;: true,
      &quot;esModuleInterop&quot;: true,
      &quot;allowSyntheticDefaultImports&quot;: true,
      &quot;resolveJsonModule&quot;: true,
      &quot;sourceMap&quot;: true,
      &quot;baseUrl&quot;: &quot;.&quot;,
      &quot;types&quot;: [
        &quot;node&quot;,
        &quot;jest&quot;,
        &quot;webpack-env&quot;,
      ],
      &quot;typeRoots&quot;: [
        &quot;./src/@types&quot;,
        &quot;./node_modules/@types&quot;
      ],
      &quot;paths&quot;: {
        &quot;@/*&quot;: [
          &quot;src/*&quot;
        ]
      },
      &quot;lib&quot;: [
        &quot;esnext&quot;,
        &quot;dom&quot;,
        &quot;dom.iterable&quot;,
        &quot;scripthost&quot;
      ]
    },
    &quot;include&quot;: [ &quot;src/**/*&quot;, &quot;tests/**/*&quot; ],
    &quot;exclude&quot;: [ &quot;node_modules&quot; ]
  }
  </code></pre>
  <p><strong>.eslint.js</strong></p>
  <pre class="lang-js prettyprint-override"><code>module.exports = {
    root: true,
    env: {
      browser: true,
      node: true,
      es6: true
    },
    parser: 'vue-eslint-parser',
    parserOptions: {
      parser: '@typescript-eslint/parser',
      sourceType: 'module',
      ecmaVersion: 2020
    },
    plugins: [
      'vue'
    ],
    rules: {
      'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
      'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
      'class-methods-use-this': 0,
      'consistent-return': 0,
      'import/no-cycle': 0,
      'import/extensions': 0,
      'import/no-extraneous-dependencies': 0,
      'space-before-function-paren': [2, 'never'],
      'vue/array-bracket-spacing': 'error',
      'vue/arrow-spacing': 'error',
      'vue/block-spacing': 'error',
      'vue/brace-style': 'error',
      'vue/camelcase': 'error',
      'vue/comma-dangle': 'error',
      'vue/component-name-in-template-casing': 'error',
      'vue/eqeqeq': 'error',
      'vue/key-spacing': 'error',
      'vue/match-component-file-name': 'error',
      'vue/object-curly-spacing': 'error',
      'vue/max-attributes-per-line': ['error', {
        singleline: 3,
        multiline: {
          max: 1,
          allowFirstLine: false
        }
      }]
    },
    extends: [
      'eslint:recommended',
      'airbnb-base',
      'plugin:vue/recommended',
      '@vue/standard',
      '@vue/typescript'
    ]
  }
  </code></pre>
  <p><strong>src/@types/typings.d.ts</strong></p>
  <pre class="lang-js prettyprint-override"><code>type MyType = {
    value: any
  }
  </code></pre>
  <p><strong>src/App.vue</strong></p>
  <pre><code>&lt;template&gt;
    &lt;div id=&quot;app&quot;&gt;
      &lt;router-view /&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script lang=&quot;ts&quot;&gt;
  import { Component, Vue } from 'vue-property-decorator'
  
  @Component({
    name: 'App',
  })
  export default class extends Vue {
    myField: MyType = { value: 1 } // The error is here | Ошибка здесь
  &lt;/script&gt;
  </code></pre>
  <p><strong>Error</strong></p>
  <pre><code>error: 'MyType' is not defined (no-undef) at src/App.vue:15:12:
    13 | })
    14 | export default class extends Vue {
  &gt; 15 |   myField: MyType = { value: 1 }
       |            ^
    16 | }
    17 | &lt;/script&gt;
    18 | 
  </code></pre>