时间戳

首页 > 解决方案 > ESLint 在模板中找不到未定义的方法或属性

typescript - ESLint 在模板中找不到未定义的方法或属性

问题描述

我用 typescript 编写 Vue 组件，并使用 typescript-eslint。
如果模板有未定义的方法或属性，在它运行之前我找不到它。
在 VSCode 和 npm run lint 上都可以找到其他问题，例如“无尾随空格”。
什么规则可以找到这个问题？

包.json

  "devDependencies": {
    "@types/jest": "^24.0.19",
    "@typescript-eslint/eslint-plugin": "^2.18.0",
    "@typescript-eslint/parser": "^2.18.0",
    "@vue/cli-plugin-eslint": "~4.2.0",
    "@vue/cli-plugin-router": "~4.2.0",
    "@vue/cli-plugin-typescript": "~4.2.0",
    "@vue/cli-plugin-unit-jest": "~4.2.0",
    "@vue/cli-plugin-vuex": "~4.2.0",
    "@vue/cli-service": "~4.2.0",
    "@vue/eslint-config-typescript": "^5.0.1",
    "@vue/eslint-config-airbnb": "^5.0.2",
    "@vue/test-utils": "1.0.0-beta.31",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.1.2",
    "sass": "^1.25.0",
    "sass-loader": "^8.0.2",
    "typescript": "~3.7.5",
    "vue-template-compiler": "^2.6.11"
  }

<template>
  <div>
    <div @click="undefinedNiceMethod()">   
      {{undefined_variable}}
    </div>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';

@Component({})
export default class Hoge extends Vue {
  blankValue: string = '';
}
</script>

标签： typescriptvuejs2eslint

解决方案

no-undef使用 eslint 在 Vue 模板中无法捕获此错误。

我将结束这个提议，因为我相信它几乎不可能实现，即使它是 - 因为应该满足的不同标准的数量很可能会导致一些误报，并且可能弊大于利. 如果您不同意并且知道如何最好地解决此问题，请重新打开此问题并分享您的想法 :)

来源：规则提案：vue/no-undef

推荐阅读