## 事象
[[Nuxt3]]のプロジェクトにて。
`package.json`の一部。
```json
"dependencies": {
"nuxt": "^3.12.4",
"vue": "latest"
},
"optionalDependencies": {
"typescript": "^5.5.4"
},
"devDependencies": {
"@fsouza/prettierd": "^0.25.3",
"prettier-plugin-organize-imports": "^4.0.0"
}
```
`.prettierrc.json`
```json
{
"plugins": ["prettier-plugin-organize-imports"]
}
```
`lib.ts`
```ts
export function hoge(): string {
return "hoge";
}
```
この状態で`index.vue`を作成し
`pages/index.vue`
```html
<script setup lang="ts">
import { hoge } from "~/lib";
</script>
<template>
<div v-text="hoge()"></div>
</template>
```
保存すると、import文が消えてしまう。以下のようになる。
```html
<script setup lang="ts"></script>
<template>
<div v-text="hoge()"></div>
</template>
```
なお、以下の場合は消えない。
```html
<script setup lang="ts">
import { hoge } from "~/lib";
</script>
<template>
<div>{{ hoge() }}</div>
</template>
```
## 原因
ちゃんとした原因は分からない。おそらく、[[tsc]]が[[HTML]]の[[属性 (HTML)|属性]]まで把握できてなさそうに見える。未使用と判定されて削除されたのかなと。
## 解決方法
[[vue-tsc]]をインストールする。
```console
bun add -D vue-tsc
```
これで削除されなくなった。