path aliasを使ったTypescriptファイルをtscでコンパイルする

公開日時

Typescriptでpath aliasを使うと、[[import xxx from '@/lib/xxxx']]のようにimport文が書けるので相対パスで記述するより可読性が上がる。

path aliasはtsconfig.jsonに↓のように設定する。

    "baseUrl": ".",
    "paths": {
      "@/*": ["*"]
    }

開発時は↓のようにts-nodeとtsconfig-pathsを使ってpath aliasが使えるようにしていた。

ts-node -r tsconfig-paths/register ./app/index.ts

開発環境はこれで問題なかったが、本番環境用にtscでビルドした際にpath aliasだとエラーになってしまったため、tsc-aliasを使ってpath aliasを相対パス形式に変換するようにした。

package.jsonのbuildコマンドを↓に設定することで、コンパイル後のjsもエラーなく実行できるようになった。

"scripts": {
  "build": "tsc -p tsconfig.json && tsc-alias -p tsconfig.json",
  "start": "node dist/app/index.js"
}

最初はtscpathsで変換しようとしたが、変換後のjsがエラーになってしまったためtsc-aliasを使うようにした。

また、startコマンドの中でtsconfig-pathsを読み込むことで対応もできそうだったが、devDependencyのライブラリを本番起動時に読み込ませるのは避けたかったので事前にパスを変換するようにした。


Related #js