Subscribe on changes!

Vue compiler adds import of mergeModels from vue, while it is not exposed in typings.

avatar
Feb 12th 2024

Vue version

3.4.18

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-kp769z?file=README.txt

Steps to reproduce

npm run build

What is expected?

Successful generation of ts/d.ts files.

What is actually happening?

[!] (plugin rpt2) RollupError: src/MyComponent.vue?vue&type=script&setup=true&lang.ts:1:33 - error TS2305: Module '"vue"' has no exported member 'mergeModels'.

1 import { useModel as _useModel, mergeModels as _mergeModels, defineComponent as _defineComponent } from 'vue' ~~~~~~~~~~~

src/MyComponent.vue?vue&type=script&setup=true&lang.ts

at Object.error (/home/projects/vitejs-vite-kp769z/node_modules/rollup/dist/shared/parseAst.js:279:30)
at Object.error (/home/projects/vitejs-vite-kp769z/node_modules/rollup/dist/shared/rollup.js:824:32)
at RollupContext.error (/home/projects/vitejs-vite-kp769z/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:1457:26)
at eval (/home/projects/vitejs-vite-kp769z/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:27639:26)
at printDiagnostics (/home/projects/vitejs-vite-kp769z/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:27615:17)
at typecheckFile (/home/projects/vitejs-vite-kp769z/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:27972:9)
at Object.eval (/home/projects/vitejs-vite-kp769z/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:28118:21)
at eval (/home/projects/vitejs-vite-kp769z/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:63:69)

System Info

"vue": "^3.4.18"
"@rollup/plugin-node-resolve": "^15.2.3",
"@vue/compiler-sfc": "^3.4.18",
"rollup": "^4.10.0",
"rollup-plugin-typescript2": "^0.36.0",
"rollup-plugin-vue": "^6.0.0",
"typescript": "^5.3.3"

Any additional comments?

Seems to happen with rollup library setup (see repro), in SFC when both defineProps and defineModel are present. Comment out defineProps and remove :id attribute on input element to make build pass.

avatar
Feb 12th 2024

This is an issue with the rollup setup is essentially typechecking the generated code after template compilation - that code is not meant to be typechecked.

The mergeModels helper function is explicitly marked as internal because it's only used/inserted by the compiler and not considered a public API - so we don't want it to be exposed in vue's type declarations.

We 'strongly recommend using vue-tsc to generate type declarations instead:

https://vuejs.org/guide/typescript/overview.html#overview

If using SFCs, use the vue-tsc utility for command line type checking and type declaration generation. vue-tsc is a wrapper around tsc, TypeScript's own command line interface. It works largely the same as tsc except that it supports Vue SFCs in addition to TypeScript files. You can run vue-tsc in watch mode in parallel to the Vite dev server, or use a Vite plugin like vite-plugin-checker which runs the checks in a separate worker thread.

avatar
Feb 13th 2024

This is a wontfix. Like @LinusBorg said, type checking should only happen to user-authored source code, not transformed / generated code.

avatar
Feb 13th 2024

Thank you both for the explanation. If vue-tsc is the recommended path to generate the typings, what is the preferred way to generate the js-part for SFCs in a library? Being able to do both in one step was the reason we went with rollup instead of vue-tsc in the first place.

avatar
Feb 13th 2024

Use Vite (which is using Rollup under the hood) + @vitejs/plugin-vue

If you have to stick to plain Rollup for some reason, you can use a Rollup plugin that only performs TS transpilation without type checking, e.g. https://www.npmjs.com/package/rollup-plugin-esbuild

avatar
Feb 23rd 2024

Thank you! We've switched now. 👍