[VSCode]TypeScript 絶対パスでAuto Importを行う

はじめに

VSCodeでモジュールのAuto Importを行った際、下記のようになったことはないでしょうか？
絶対パスでimportして欲しいものです。

import { TestModel } from '../../../model/test.model';

2021年4月時点

環境

• VSCode: 1.55.0
• TypeScript: 4.2.3

VSCodeの設定

VSCodeの設定で対処できます。

settings.json

{
  "typescript.preferences.importModuleSpecifier": "non-relative"
}

tsconfig.jsonのbaseUrl、pathsの設定を使って絶対パスでのimportができるようになります。

import { TestModel } from 'src/app/shared/model/test.model';

オプション一覧

1. shortest(default)

   • 相対インポートよりもパス セグメント数が少なくなる場合にのみ、非相対インポートを優先します。

2. relative

   • インポートされたファイルの場所への相対パスを優先します。

3. non-relative

   • jsconfig.jsonまたは tsconfig.jsonに構成されているbseUrlまたはpathsに基づいて非相対インポートを優先

4. project-relative

   • 相対インポート パスでパッケージまたはプロジェクトディレクトリが提供される場合にのみ、非相対インポートを優先します。ワークスペースでTypeScript 4.2 + を使用する必要があります。