Why can volar detect that I am using a component that lacks a prop, but eslint cannot detect it?

[zuohuaiyu]

I modified the props of a component in the project, but the Vue file that uses the component only prompts an error when opened, and running eslint does not prompt this error.

Here is my project eslint config:

module.exports = {
  root: true,
  env: {
    node: true
  },
  'extends': [
    'plugin:vue/vue3-essential',
    'eslint:recommended',
    '@vue/typescript/recommended'
  ],
  parserOptions: {
    ecmaVersion: 2020
  },
  rules: {
    'no-console': 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    "@typescript-eslint/no-explicit-any": ["off"],
    "@typescript-eslint/no-non-null-assertion": ['off'],
    '@typescript-eslint/no-var-requires': 0,
    "vue/no-parsing-error": 'off'
  },
  globals: {
    defineProps: "readonly",
    defineEmits: "readonly",
    defineExpose: "readonly",
    withDefaults: "readonly",
  },
  overrides: [
    {
      files: [
        '**/__tests__/*.{j,t}s?(x)',
        '**/tests/unit/**/*.spec.{j,t}s?(x)'
      ],
      env: {
        jest: true
      }
    }
  ]
}

tsconfig:

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "importHelpers": true,
    "moduleResolution": "node",
    "skipLibCheck": true,
    "esModuleInterop": true,
    "resolveJsonModule": true,
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "noImplicitAny": true,
    "baseUrl": ".",
    "types": [
      "element-plus/global",
      "webpack-env",
      "jest"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}

package.json :

{
  "name": "",
  "author": "",
  "description": "",
  "version": "1",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "test:unit": "vue-cli-service test:unit",
    "lint": "vue-cli-service lint",
    "e:dev": "cross-env VUE_APP_ENV=dev vue-cli-service electron:serve",
  },
  "main": "background.js",
  "dependencies": {
    "@element-plus/icons": "^0.0.11",
    "@element-plus/icons-vue": "^0.2.4",
    "@sentry/electron": "^4.0.0",
    "@sentry/tracing": "^7.11.1",
    "compressing": "^1.6.2",
    "core-js": "^3.6.5",
    "cross-env": "^7.0.3",
    "dayjs": "^1.11.7",
    "echarts": "^5.3.2",
    "element-plus": "^2.3.7",
    "md5": "^2.3.0",
    "postcss-pxtorem": "5.1.1",
    "sa-sdk-javascript": "^1.24.7",
    "unplugin-vue-components": "^0.16.0",
    "vue": "^3.3.4",
    "vue-echarts": "^6.0.2",
    "vue-router": "^4.0.0-0",
    "vuex": "^4.0.0-0"
  },
  "devDependencies": {
    "@sentry/webpack-plugin": "^1.19.0",
    "@types/electron-devtools-installer": "^2.2.0",
    "@types/jest": "^24.0.19",
    "@typescript-eslint/eslint-plugin": "^4.18.0",
    "@typescript-eslint/parser": "^4.18.0",
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-typescript": "~4.5.0",
    "@vue/cli-plugin-unit-jest": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "^3.0.0",
    "@vue/eslint-config-typescript": "^7.0.0",
    "@vue/test-utils": "^2.0.0-0",
    "electron": "13.6.3",
    "electron-devtools-installer": "^3.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^7.0.0",
    "sass": "^1.43.4",
    "sass-loader": "^8.0.2",
    "typescript": "~4.1.5",
    "vue-cli-plugin-electron-builder": "~2.1.1",
    "vue-jest": "^5.0.0-0"
  },
  "resolutions": {
    "vue-cli-plugin-electron-builder/electron-builder": "23.0.2"
  },
  "__npminstall_done": false
}

[so1ve]

ESLint never checks whether a prop is missing, nor the arguments passed to a function. These diagnostics are provided by language service, not by ESLint. ESLint is a static analyzer.

[zuohuaiyu]

Thanks for your reply. The vue-tsc tool helped me solve this problem.