問題:"@types"を定義するとインポートエラーが発生する
型定義ファイルをまとめて格納するための、typesディレクトリがあったとします。
呼び出すたびにパスを直接指定するのは、保守の観点から望ましくないため、
tsconfig.jsonへパスエイリアスを追加したとします。
import { Article } from '@types/article';
インポートを行うと
型宣言ファイルをインポートできません。'@types/article' の代わりに 'article' をインポートすることを検討してください。
パスが正しい場合でもエラーが発生します。
なぜこのようなエラーが発生するのでしょうか?
原因:node_modulesのパスエイリアスと名前衝突するため
TypeScriptはデフォルトで "node_modules/@types" 内の型定義ファイルを読み込みます。
このエイリアスが、自分で作成した@typesと競合するためエラーになります。
エラーテキストはパスが間違っているかもと推測しかねない文章なので、注意が必要です。
解決策:競合しない別名を使用する
解決策はシンプルで、競合しない名前で作成すればよいです。
custom-types や my-types など競合しない名前をディレクトリ名として使用します。
参考
@typesの自動読み込み
競合を回避するにはnode_modulesの/@ファイル名を確認