Jestでaliasを使ったモジュール参照を扱う
2019-06-07

Jestでaliasを使ったモジュール参照を扱う

JavaScriptのテストフレームワークJestの小ネタです。

最近reactやreact-nativeのプロジェクトでモジュールの参照にaliasを使うことが多いのですが、Jestでこれを扱う方法について紹介です。

aliasを使ったモジュール参照

aliasを使ったモジュール参照とは、プロジェクト内の特定のディレクトに別名(alias)をつけることで、import文の記述を簡単にすることです。

例えば、次のような相対パスでモジュールをimportしている箇所にaliasを使ってみましょう。

// greet.ts は src/shared/services にあるとする
import { greet } from '../../../greet.ts'

aliasを使う場合は、まずsrc/sharedSharedというaliasをつけます。そうすると次のように相対パスを除いて書くことができます。

// Shared は src/shared を参照している
import { greet } from 'Shared/services/greet.ts'

aliasを使うメリットとしては、import文の記述を簡略化することもあるますが、相対パスを使った場合よりリファクタなどの変更に強いことが挙げられます。

moduleNameMapperを使ってaliasを扱う

Jestでaliasを扱うためにはmoduleNameMapperを使ってaliasと実際のパスをマッピングします。

上の例の場合は次のようになります。

module.exports = {
  moduleNameMapper: {
    '^Shared(.*)$': '<rootDir>/src/shared/$1'
  }
};

これでJestでも、aliasを使ったモジュール参照があるプロジェクトをテストすることができました。