From 6a8d4ed88a7734a5554194805c44ad679bd3a27f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rafa=C5=82=20Ch=C5=82odnicki?= Date: Mon, 4 Sep 2023 10:14:10 +0200 Subject: [PATCH] fix(types): prevent overwriting vue types in template (#22802) --- .eslintignore | 3 + .github/workflows/test.yml | 3 + package.json | 8 +- packages/types/app/vue.d.ts | 3 +- .../vue-tsc/components/my-component.vue | 18 ++++ test/fixtures/vue-tsc/pages/index.vue | 6 ++ test/fixtures/vue-tsc/tsconfig.json | 23 ++++ test/fixtures/vue-tsc/types/vue.d.ts | 7 ++ yarn.lock | 101 ++++++++++++++++-- 9 files changed, 161 insertions(+), 11 deletions(-) create mode 100644 test/fixtures/vue-tsc/components/my-component.vue create mode 100644 test/fixtures/vue-tsc/pages/index.vue create mode 100644 test/fixtures/vue-tsc/tsconfig.json create mode 100644 test/fixtures/vue-tsc/types/vue.d.ts diff --git a/.eslintignore b/.eslintignore index 5848c5cda3..a73a3004a4 100644 --- a/.eslintignore +++ b/.eslintignore @@ -12,6 +12,9 @@ examples/pug-stylus-coffee/**/*.* examples/web-worker/**/*.* examples/vue-class-component/**/*.* +## vue with typescript +test/fixtures/vue-tsc/**/*.vue + # Packages # vue-app diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index 9a3b51c7a2..bc132c4484 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -85,6 +85,9 @@ jobs: - name: test types run: yarn test:types + + - name: test types with vue-tsc + run: yarn test:vue-types needs: setup audit: diff --git a/package.json b/package.json index 3c7c7101ef..aef6d467b3 100644 --- a/package.json +++ b/package.json @@ -24,13 +24,14 @@ "ls-lint": "npx @ls-lint/ls-lint", "nuxt": "jiti ./packages/cli/bin/nuxt-cli.js", "pkg": "jiti ./scripts/pkg.js", - "test": "yarn test:fixtures && yarn test:dev && yarn test:unit && yarn test:types", + "test": "yarn test:fixtures && yarn test:dev && yarn test:unit && yarn test:types && yarn test:vue-types", "test:dev": "jest test/dev --forceExit --runInBand", "test:e2e": "jest -i test/e2e --forceExit", "test:fixtures": "jest test/fixtures --forceExit", "test:lint": "yarn lint && yarn ls-lint", "test:types": "tsc -p packages/types/test", - "test:unit": "jest packages --forceExit" + "test:unit": "jest packages --forceExit", + "test:vue-types": "vue-tsc -p ./test/fixtures/vue-tsc/tsconfig.json" }, "devDependencies": { "@babel/core": "7.22.11", @@ -86,7 +87,8 @@ "sass-loader": "^10.1.1", "sort-package-json": "2.5.1", "typescript": "5.2.2", - "vue-jest": "4.0.1" + "vue-jest": "4.0.1", + "vue-tsc": "^1.8.8" }, "packageManager": "yarn@1.22.19" } diff --git a/packages/types/app/vue.d.ts b/packages/types/app/vue.d.ts index d1f3b90c11..50926d633c 100644 --- a/packages/types/app/vue.d.ts +++ b/packages/types/app/vue.d.ts @@ -23,7 +23,8 @@ type DefaultMethods = { [key: string]: (this: V, ...args: any[]) => any } type DefaultComputed = { [key: string]: any } type DefaultAsyncData = ((this: never, context: Context) => Promise | object | void) -declare module 'vue/types' { +// Extend built-in defineComponent with variants that support inferring asyncData return value. +declare module 'vue/types/v3-define-component' { /** * overload 1: object format with no props */ diff --git a/test/fixtures/vue-tsc/components/my-component.vue b/test/fixtures/vue-tsc/components/my-component.vue new file mode 100644 index 0000000000..1b73ca81b0 --- /dev/null +++ b/test/fixtures/vue-tsc/components/my-component.vue @@ -0,0 +1,18 @@ + + + diff --git a/test/fixtures/vue-tsc/pages/index.vue b/test/fixtures/vue-tsc/pages/index.vue new file mode 100644 index 0000000000..7efb758e46 --- /dev/null +++ b/test/fixtures/vue-tsc/pages/index.vue @@ -0,0 +1,6 @@ + diff --git a/test/fixtures/vue-tsc/tsconfig.json b/test/fixtures/vue-tsc/tsconfig.json new file mode 100644 index 0000000000..a5e2a5f43a --- /dev/null +++ b/test/fixtures/vue-tsc/tsconfig.json @@ -0,0 +1,23 @@ +{ + "compilerOptions": { + "allowJs": true, + "checkJs": true, + "module": "ES2022", + "moduleResolution": "Node", + "noEmit": true, + "target": "ES2022", + "types": [ + "../../../packages/types", + "./types/vue", + ], + "strict": true, + }, + "include": [ + "./components/*.vue", + "./pages/*.vue", + ], + "vueCompilerOptions": { + "strictTemplates": true, + "target": 2.7 + } +} diff --git a/test/fixtures/vue-tsc/types/vue.d.ts b/test/fixtures/vue-tsc/types/vue.d.ts new file mode 100644 index 0000000000..5aa2021f72 --- /dev/null +++ b/test/fixtures/vue-tsc/types/vue.d.ts @@ -0,0 +1,7 @@ +import 'vue'; + +declare module 'vue' { + export interface GlobalComponents { + MyComponent: typeof import('../components/my-component.vue').default; + } +} diff --git a/yarn.lock b/yarn.lock index de5bd12448..036dee81b4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -292,10 +292,10 @@ resolved "https://registry.npmjs.org/@babel/parser/-/parser-7.22.10.tgz#e37634f9a12a1716136c44624ef54283cabd3f55" integrity sha512-lNbdGsQb9ekfsnjFGhEiF4hfFqGgfOP3H3d27re3n+CGhNuTSUEQdfWk556sTLNTloczcdM5TYF2LhzmDQKyvQ== -"@babel/parser@^7.22.11": - version "7.22.11" - resolved "https://registry.npmjs.org/@babel/parser/-/parser-7.22.11.tgz#becf8ee33aad2a35ed5607f521fe6e72a615f905" - integrity sha512-R5zb8eJIBPJriQtbH/htEQy4k7E2dHWlD2Y2VT07JCzwYZHBxV5ZYtM0UhXSNMT74LyxuM+b1jdL7pSesXbC/g== +"@babel/parser@^7.21.3", "@babel/parser@^7.22.11": + version "7.22.14" + resolved "https://registry.npmjs.org/@babel/parser/-/parser-7.22.14.tgz#c7de58e8de106e88efca42ce17f0033209dfd245" + integrity sha512-1KucTHgOvaw/LzCVrEOAyXkr9rQlp0A1HiHRYnSUE9dmb8PvPW7o5sscg+5169r54n3vGlbx6GevTE/Iw/P3AQ== "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@^7.22.5": version "7.22.5" @@ -3025,6 +3025,27 @@ "@typescript-eslint/types" "6.4.1" eslint-visitor-keys "^3.4.1" +"@volar/language-core@1.10.1", "@volar/language-core@~1.10.0": + version "1.10.1" + resolved "https://registry.npmjs.org/@volar/language-core/-/language-core-1.10.1.tgz#76789c5b0c214eeff8add29cbff0333d89b6fc4a" + integrity sha512-JnsM1mIPdfGPxmoOcK1c7HYAsL6YOv0TCJ4aW3AXPZN/Jb4R77epDyMZIVudSGjWMbvv/JfUa+rQ+dGKTmgwBA== + dependencies: + "@volar/source-map" "1.10.1" + +"@volar/source-map@1.10.1", "@volar/source-map@~1.10.0": + version "1.10.1" + resolved "https://registry.npmjs.org/@volar/source-map/-/source-map-1.10.1.tgz#b806845782cc615f2beba94624ff34a700f302f5" + integrity sha512-3/S6KQbqa7pGC8CxPrg69qHLpOvkiPHGJtWPkI/1AXCsktkJ6gIk/5z4hyuMp8Anvs6eS/Kvp/GZa3ut3votKA== + dependencies: + muggle-string "^0.3.1" + +"@volar/typescript@~1.10.0": + version "1.10.1" + resolved "https://registry.npmjs.org/@volar/typescript/-/typescript-1.10.1.tgz#b20341c1cc5785b4de0669ea645e1619c97a4764" + integrity sha512-+iiO9yUSRHIYjlteT+QcdRq8b44qH19/eiUZtjNtuh6D9ailYM7DVR0zO2sEgJlvCaunw/CF9Ov2KooQBpR4VQ== + dependencies: + "@volar/language-core" "1.10.1" + "@vue/babel-helper-vue-jsx-merge-props@^1.4.0": version "1.4.0" resolved "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.4.0.tgz#8d53a1e21347db8edbe54d339902583176de09f2" @@ -3105,6 +3126,24 @@ "@vue/babel-plugin-transform-vue-jsx" "^1.4.0" camelcase "^5.0.0" +"@vue/compiler-core@3.3.4": + version "3.3.4" + resolved "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.3.4.tgz#7fbf591c1c19e1acd28ffd284526e98b4f581128" + integrity sha512-cquyDNvZ6jTbf/+x+AgM2Arrp6G4Dzbb0R64jiG804HRMfRiFXWI6kqUVqZ6ZR0bQhIoQjB4+2bhNtVwndW15g== + dependencies: + "@babel/parser" "^7.21.3" + "@vue/shared" "3.3.4" + estree-walker "^2.0.2" + source-map-js "^1.0.2" + +"@vue/compiler-dom@^3.3.0": + version "3.3.4" + resolved "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.3.4.tgz#f56e09b5f4d7dc350f981784de9713d823341151" + integrity sha512-wyM+OjOVpuUukIq6p5+nwHYtj9cFroz9cwkfmP9O1nzH68BenTTv0u7/ndggT8cIQlnBeOo6sUT/gvHcIkLA5w== + dependencies: + "@vue/compiler-core" "3.3.4" + "@vue/shared" "3.3.4" + "@vue/compiler-sfc@2.7.14": version "2.7.14" resolved "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.14.tgz#3446fd2fbb670d709277fc3ffa88efc5e10284fd" @@ -3130,6 +3169,27 @@ optionalDependencies: prettier "^1.18.2 || ^2.0.0" +"@vue/language-core@1.8.8": + version "1.8.8" + resolved "https://registry.npmjs.org/@vue/language-core/-/language-core-1.8.8.tgz#5a8aa8363f4dfacdfcd7808a9926744d7c310ae6" + integrity sha512-i4KMTuPazf48yMdYoebTkgSOJdFraE4pQf0B+FTOFkbB+6hAfjrSou/UmYWRsWyZV6r4Rc6DDZdI39CJwL0rWw== + dependencies: + "@volar/language-core" "~1.10.0" + "@volar/source-map" "~1.10.0" + "@vue/compiler-dom" "^3.3.0" + "@vue/reactivity" "^3.3.0" + "@vue/shared" "^3.3.0" + minimatch "^9.0.0" + muggle-string "^0.3.1" + vue-template-compiler "^2.7.14" + +"@vue/reactivity@^3.3.0": + version "3.3.4" + resolved "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.3.4.tgz#a27a29c6cd17faba5a0e99fbb86ee951653e2253" + integrity sha512-kLTDLwd0B1jG08NBF3R5rqULtv/f8x3rOFByTDz4J53ttIQEDmALqKqXY0J+XQeN0aV2FBxY8nJDf88yvOPAqQ== + dependencies: + "@vue/shared" "3.3.4" + "@vue/server-test-utils@1.3.0": version "1.3.0" resolved "https://registry.npmjs.org/@vue/server-test-utils/-/server-test-utils-1.3.0.tgz#56c8f41cbb4ed9af38a5668cc23f861fcbbcd44b" @@ -3138,6 +3198,11 @@ "@types/cheerio" "^0.22.10" cheerio "^1.0.0-rc.2" +"@vue/shared@3.3.4", "@vue/shared@^3.3.0": + version "3.3.4" + resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.3.4.tgz#06e83c5027f464eef861c329be81454bc8b70780" + integrity sha512-7OjdcV8vQ74eiz1TZLzZP4JwqM5fA94K6yntPS5Z25r9HDuGNzaGdgvwKYq6S+MxwF0TFRwe50fIR/MYnakdkQ== + "@vue/test-utils@1.3.6": version "1.3.6" resolved "https://registry.npmjs.org/@vue/test-utils/-/test-utils-1.3.6.tgz#6656bd8fa44dd088b4ad80ff1ee28abe7e5ddf87" @@ -3147,6 +3212,14 @@ lodash "^4.17.15" pretty "^2.0.0" +"@vue/typescript@1.8.8": + version "1.8.8" + resolved "https://registry.npmjs.org/@vue/typescript/-/typescript-1.8.8.tgz#8efb375d448862134492a044f4e96afada547500" + integrity sha512-jUnmMB6egu5wl342eaUH236v8tdcEPXXkPgj+eI/F6JwW/lb+yAU6U07ZbQ3MVabZRlupIlPESB7ajgAGixhow== + dependencies: + "@volar/typescript" "~1.10.0" + "@vue/language-core" "1.8.8" + "@vue/vue2-jest@29.2.5": version "29.2.5" resolved "https://registry.npmjs.org/@vue/vue2-jest/-/vue2-jest-29.2.5.tgz#ed93322515c3d5dc434ff4822b294af9e75fab1d" @@ -4396,9 +4469,9 @@ caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001464, caniuse-lite@^1.0.30001517: integrity sha512-0QHgqR+Jv4bxHMp8kZ1Kn8CH55OikjKJ6JmKkZYP1F3D7w+lnFXF70nG5eNfsZS89jadi5Ywy5UCSKLAglIRkg== caniuse-lite@^1.0.30001523: - version "1.0.30001523" - resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001523.tgz#b838f70b1a98c556776b998fafb47d2b64146d4f" - integrity sha512-I5q5cisATTPZ1mc588Z//pj/Ox80ERYDfR71YnvY7raS/NOk8xXlZcB0sF7JdqaV//kOaa6aus7lRfpdnt1eBA== + version "1.0.30001525" + resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001525.tgz#d2e8fdec6116ffa36284ca2c33ef6d53612fe1c8" + integrity sha512-/3z+wB4icFt3r0USMwxujAqRvaD/B7rvGTsKhbhSQErVrJvkZCLhgNLJxU8MevahQVH6hCU9FsHdNUFbiwmE7Q== caseless@~0.12.0: version "0.12.0" @@ -10036,6 +10109,11 @@ ms@2.1.3, ms@^2.0.0, ms@^2.1.1: resolved "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2" integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA== +muggle-string@^0.3.1: + version "0.3.1" + resolved "https://registry.npmjs.org/muggle-string/-/muggle-string-0.3.1.tgz#e524312eb1728c63dd0b2ac49e3282e6ed85963a" + integrity sha512-ckmWDJjphvd/FvZawgygcUeQCxzvohjFO5RxTjj4eq8kw359gFF3E1brjfI+viLMxss5JrHTDRHZvu2/tuy0Qg== + multimatch@5.0.0: version "5.0.0" resolved "https://registry.npmjs.org/multimatch/-/multimatch-5.0.0.tgz#932b800963cea7a31a033328fa1e0c3a1874dbe6" @@ -14411,6 +14489,15 @@ vue-template-es2015-compiler@^1.9.0: resolved "https://registry.npmjs.org/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825" integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw== +vue-tsc@^1.8.8: + version "1.8.8" + resolved "https://registry.npmjs.org/vue-tsc/-/vue-tsc-1.8.8.tgz#67317693eb2ef6747e89e6d834eeb6d2deb8871d" + integrity sha512-bSydNFQsF7AMvwWsRXD7cBIXaNs/KSjvzWLymq/UtKE36697sboX4EccSHFVxvgdBlI1frYPc/VMKJNB7DFeDQ== + dependencies: + "@vue/language-core" "1.8.8" + "@vue/typescript" "1.8.8" + semver "^7.3.8" + vue@^2.7.10: version "2.7.14" resolved "https://registry.npmjs.org/vue/-/vue-2.7.14.tgz#3743dcd248fd3a34d421ae456b864a0246bafb17"