Add instructions for type-only imports
Description of Problem
Because Vue uses isolatedModules, it is necessary to use type-only import syntax when importing types. Discovering the resolution for this edge case is difficult when first beginning to work with TypeScript and Vue/Vite.
This is easy to replicate by creating an app with create-vue and selectihg the typescript option. Then, export an interface from a .ts file and import it and try to use it as a type in a component. When you run npm run type-check you will see the error. Here is a sample repo that duplicates the problem with a new create-vue app: https://github.com/jmcooper/create-vue-ts-repro
Reproducing the Problem
See instructions above to repro from scratch. Or:
- Clone https://github.com/jmcooper/create-vue-ts-repro
npm install- Run
npm run type-check
Proposed Solution
Update the documentation as proposed to make it clear this is an expected behavior and how to resolve it.
Additional Information
Sample repo to replicate the problem: https://github.com/jmcooper/create-vue-ts-repro
Deploy Preview for vuejs ready!
| Name | Link |
|---|---|
| Latest commit | 297d6f3ac40c99f9b52bd101f9497ddf44b8ce48 |
| Latest deploy log | https://app.netlify.com/sites/vuejs/deploys/64a71025dcff850008ac5e41 |
| Deploy Preview | https://deploy-preview-2432--vuejs.netlify.app |
| Preview on mobile | Toggle QR Code...Use your smartphone camera to open QR code link. |
To edit notification comments on pull requests, go to your Netlify site configuration.