Svelte + TypeScript のベストプラクティスを考える
BRANK

consistent-type-import のための eslintrollup + svelte でハマりがちな問題として、rollup-plugin-svelte は存在しない import がエラーになる。これが色々と問題を起こす。このコードは TypeScript としては通るが、実行時にエラーになる。import { SvelteComponentTyped } from "svelte"; 例えばこの SvelteComponentTyped はコード上の実体はなく、型としてしか存在しない。webpack は単にこれを無視しているので見た目上はそのまま動くのだが、本来なら型情報かどうかを typescript としての静的解析から取り出して、型の import なので 消すかどうかを判断しないといけない。依存が 1 ホップなら簡単だが、 export * from "./data" みたいなコードを書かれた瞬間に rollup に要求する機能が静的解析気相当になってしまう。なので、型の import に type import を要求する設定が、 @tsconfig/svelte に入っている。 "importsNotUsedAsValues": "error", しかし、これだけだとまだ問題が起きる。typescript はこれを通してしまう。import { SvelteComponentTyped, onMount } from "svelte"; 型だけなら import type を要求するが、 実体を持つ関数 onMount と…

zenn.dev
Related Topics: TypeScript