仕事ですぐに使えるTypeScriptを読んでいくその27

これは

TypeScriptの学習にとても役立ちそうなドキュメントを教えてもらったので
コツコツと読んでいく記事です。

参考

著作権者：フューチャー株式会社（Future Corporation）様

future-architect.github.io

モジュール

今日も引き続きモジュールをやっていきます

中級向けの機能

リネームしてexport

asを使うことで別名でのエクスポートが可能。
インポート側のルールなどに合わせやすいようにリネームする時に使うと便利そう

function myReactComponent(props: {name: string, dispatch: (act: any) => void}) => {
    return <h1>サーヴァントは{props.name}です</h1>
}

// リネームしてエクスポート
export { favorite as kinsaba };

複数のファイル内容をまとめてエクスポート

TypeScriptでは複数ファイルを使って実装をするため、export対象も複数に跨ります。
複数のエクスポートを一つにまとめるためにエントリーポイントになる場所を一つ用意して、
そこから再エクスポートするようにすることでまとめることが可能。

export { favorite, fortune, KinSaba } from "./gatya";

// リネームもできる
export { favorite as favoriteSaba } from "./gatya";

// あとからdefaultにすることもできる
export { favorite as default } from "./gatya";

自動でライブラリを読み込ませる設定

TypeScriptにはインポートをわざわざ書かなくてもインポートされるものとして読み込ませる機能がある。
不用意に乱用すると依存関係が見えにくくなるので、使う際には注意する必要がある。

{
  "compilerOptions": {
    "types" : ["node", "jest"]
  }
}

今日はここまで。