v2: Linting issue at "emits" for defineComponent with TypeScript

[adrianchangcy]

Linting issue

Affected versions

2.0.0 to 2.0.6

Description

Code compiles and runs fine. At VS Code, it displays the linting issue twice when hovered over defineComponent's emits, exactly like so:

An object literal cannot have multiple properties with the same name.ts-plugin(1117)
An object literal cannot have multiple properties with the same name.ts-plugin(1117)

Troubleshooting attempts

Ensured that Vue - Official is the only extension enabled.
Ensured that VS Code is using Vue - Official as formatter.
Ensured that Vetur is not installed.

Possible clue

Removing the <script setup lang="ts"></script> block did remove the linting issue.

Version info

Vue - Official: 2.0.0 to 2.0.6
TypeScript: 5.4.2
Vue: 3.4.21
VS Code: 1.87.1
Node: 18.17.1
Windows: 10

Current solution

Downgrade Vue - Official to 1.8.27.

Reproduction

App.vue

<script setup lang="ts">
    //having any/no import here is irrelevant
    //however, removing this entire block removes the linting issue
</script>

<script lang="ts">
    import { defineComponent } from 'vue';

    export default defineComponent({
        //...
        emits: ['hasFart'],
        //...
    });
</script>

tsconfig.json

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "moduleResolution": "node",
    "allowJs": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "forceConsistentCasingInFileNames": true,
    "useDefineForClassFields": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "webpack-env"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx",
    "src/main.ts",
    "src/*.d.ts",
],
  "exclude": [
    "node_modules"
  ]
}

package.json

{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^6.5.1",
    "@fortawesome/free-brands-svg-icons": "^6.5.1",
    "@fortawesome/free-regular-svg-icons": "^6.5.1",
    "@fortawesome/free-solid-svg-icons": "^6.5.1",
    "@fortawesome/vue-fontawesome": "^3.0.6",
    "@headlessui/vue": "^1.7.19",
    "animejs": "^3.2.2",
    "axios": "^1.6.7",
    "core-js": "^3.36.0",
    "fix-webm-duration": "^1.0.5",
    "notiwind": "^2.0.2",
    "pinia": "^2.1.7",
    "pinia-plugin-persistedstate": "^3.2.1",
    "pinia-shared-state": "^0.5.1",
    "prettier": "^3.2.5",
    "recordrtc": "^5.6.2",
    "tailwindcss": "^3.4.1",
    "uuid": "^9.0.1",
    "vue": "^3.4.21",
    "vue-loader": "^17.4.2",
    "vue-virtual-scroller": "^2.0.0-beta.8"
  },
  "devDependencies": {
    "@babel/core": "^7.24.0",
    "@babel/eslint-parser": "^7.23.10",
    "@typescript-eslint/eslint-plugin": "^7.1.1",
    "@typescript-eslint/parser": "^7.1.1",
    "@vue/cli-plugin-babel": "~5.0.8",
    "@vue/cli-plugin-eslint": "^5.0.8",
    "@vue/cli-plugin-typescript": "^5.0.8",
    "@vue/cli-service": "^5.0.8",
    "@vue/eslint-config-typescript": "^12.0.0",
    "eslint": "^8.57.0",
    "eslint-plugin-vue": "^9.22.0",
    "typescript": "^5.4.2",
    "vue-tsc": "^2.0.6",
    "webpack-bundle-tracker": "^3.0.1"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/vue3-essential",
      "eslint:recommended",
      "@vue/typescript"
    ],
    "parserOptions": {
      "parser": "@typescript-eslint/parser"
    },
    "rules": {}
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead",
    "not ie 11"
  ]
}