`import { type A } from './types'` triggers error during build
Related plugins
-
[x] plugin-vue
-
[ ] plugin-vue-jsx
Describe the bug
I recently upgraded an app I'm working on:
-
vitefrom5.3.3to6.0.7 -
@vitejs/plugin-vuefrom5.0.5to5.2.1
And the following code:
import { type A } from './types'
raised an error during build (the build-only phase, not the type-check one):
❯ npm run build
> [email protected] build
> vue-tsc -b && vite build
vite v6.0.9 building for production...
✓ 17 modules transformed.
x Build failed in 1.16s
error during build:
Could not resolve "./types" from "src/App.vue?vue&type=script&setup=true&lang.ts"
file: /home/projects/vitejs-vite-xaslukcp/src/App.vue?vue&type=script&setup=true&lang.ts
at getRollupError (file:///home/projects/vitejs-vite-xaslukcp/node_modules/rollup/dist/es/shared/parseAst.js:558:41)
at error (file:///home/projects/vitejs-vite-xaslukcp/node_modules/rollup/dist/es/shared/parseAst.js:554:42)
at handleInvalidResolvedId (file:///home/projects/vitejs-vite-xaslukcp/node_modules/rollup/dist/es/shared/node-entry.js:20239:37)
at getResolveStaticDependencyPromises/< (file:///home/projects/vitejs-vite-xaslukcp/node_modules/rollup/dist/es/shared/node-entry.js:20199:26)
Reproduction
https://stackblitz.com/edit/vitejs-vite-xaslukcp
Steps to reproduce
- Open reproduction
- Run
npm run buildin terminal
You can then change the import on line 3 of src/App.vue:
- import { type ID } from './types';
+ import type { ID } from './types';
and run npm run build again to make it work.
According to https://www.typescriptlang.org/docs/handbook/2/modules.html#import-type, both syntaxes are valid.
Also I don't know if it helps but the following Vanilla Vite project doesn't have the issue so I guess that's a problem with the Vue plugin.
System Info
System:
OS: Linux 5.15 Ubuntu 24.04.1 LTS 24.04.1 LTS (Noble Numbat)
CPU: (20) x64 13th Gen Intel(R) Core(TM) i5-13600KF
Memory: 14.53 GB / 15.53 GB
Container: Yes
Shell: 5.9 - /bin/zsh
Binaries:
Node: 23.6.0 - ~/.nvm/versions/node/v23.6.0/bin/node
npm: 10.9.2 - ~/.nvm/versions/node/v23.6.0/bin/npm
bun: 1.1.45 - ~/.bun/bin/bun
Used Package Manager
npm (in reproduction), bun (locally)
Validations
- [x] Follow our Code of Conduct
- [x] Read the Contributing Guidelines.
- [x] Read the docs.
- [x] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- [x] Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
- [x] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
- [x] The provided reproduction is a minimal reproducible example of the bug.
The error in build is the expected behavior.
This is because import { type ID } from './types' means that named import can be removed when transformed (transformed to import './types').
On the other hand, import type { ID } from './types' means the import statement itself can be removed (transformed to empty line).
The reason why the error doesn't happen in dev seems to be related to https://github.com/dominikg/tsconfck/issues/195.
I'm having this issue since moving to Nuxt 4. Strangely enough it works fine in my local environment, but messes up in a Docker environment... Even with import type { blabla } it still messes up.
This is the error I get:
10.19 [nuxi] ERROR Nuxt Build Error: [vite:vue] [@vue/compiler-sfc] Failed to resolve import source "~/plugins/quasar-component-extensions".
10.19
10.19 /app/app/components/estate/specifications/fields/Select.vue
10.19 2 | import type { HSelectProps } from '~/plugins/quasar-component-extensions'
10.19 3 |
10.19 4 | type Props = { debounce?: number } & HSelectProps
10.19 | ^^^^^^^^^^^^
10.19 5 | const props = withDefaults(defineProps<Props>(), {
10.19 6 | // debounce: 1000,
10.19 file: /app/app/components/estate/specifications/fields/Select.vue