## 事象
[[Bun]]で以下のように`Document`型を使うとエラーになる。
```ts
export function getMetaByProperty(
dom: Document,
property: string
): string | undefined {
return dom
.querySelector(`meta[property='${property}']`)
?.attributes.getNamedItem("content")?.value;
}
```
```error
Property 'querySelector' does not exist on type 'Document'. (tsserver 2339)
```
`tsconfig.json`
```json
{
"compilerOptions": {
"baseUrl": ".",
"inlineSourceMap": true,
"inlineSources": true,
"module": "ESNext",
"target": "ES6",
"strict": true,
"allowJs": true,
"noImplicitAny": true,
"moduleResolution": "node",
"importHelpers": true,
"isolatedModules": true,
"strictNullChecks": true,
"allowSyntheticDefaultImports": true,
"lib": ["DOM", "ES5", "ES6", "ES7"],
"types": ["@types/bun"]
},
"include": ["**/*.ts"]
}
```
## 原因
[[bun-types]]を使うとデフォルトの型定義を除外してしまうからっぽい。
> ```ts
> /// <reference no-default-lib="true" />
> ```
> [!question]
> [[@types.bun|@types/bun]]を使っていてもダメなのか..? 今回はそうしているのに... 🤔
## 解決方法
回避策として、[[@types.web|@types/web]]を使う方法がある。
```console
bun add -d @types/web
```
`tsconfig.json`
```diff
{
"compilerOptions": {
- "types": ["@types/bun"]
+ "types": ["web", "@types/bun"]
},
}
```
> [!caution]
> この回避策だと、[[Next.js]]が壊れたという話も上がっているので解決策とはいえない。[[bun-types]]
## 参考
- [Adding \`bun\-types\` causes typescript to ignore \`lib: \['dom'\]\` · Issue \#463 · oven\-sh/bun](https://github.com/oven-sh/bun/issues/463)