ExpoはデフォルトでTypeScriptが使える!!!

expoでtypescriptを使うのが簡単で感動したのでメモ

Expo31.0.0では、FlowからTypeScriptへの移行が進んだ。
そのため、.jsファイルを.tsや.tsxに書き換えるだけで、typescriptの導入が出来る!!!
babelをいじる必要なし！！！
yarn addいらない！！！
最高だ。Expo結婚してくれ。
ただルートファイルであるApp.jsだけは.jsのままにする必要がある。App.jsに.tsxファイルをimportするのは大丈夫。

まず何も考えずにexpoでアプリを作成。

$ npm i -g expo
$ expo init my-folder
$ cd my-folder

tsconfigを作成

とりあえず以下をプロジェクト直下に記述。
設定の意味は、考えるんじゃない感じるんだ。

// tsconfig.json
{
  "compilerOptions": {
  "outDir": "build",
  "rootDir": "src",
  "sourceMap": true,
  "noImplicitAny": true,
  "noUnusedLocals": true,
  "noUnusedParameters": true,
  "module": "commonjs",
  "target": "es6",
  "jsx": "react",
  "strict": true,
  "typeRoots": ["node_modules/@types", "screens/custom-types"], 
  "baseUrl": ".",
  "moduleResolution": "node",
  "esModuleInterop": true  },
  "include": ["./screens/**/*"],
  "exclude": ["node_modules"]
}

最後にreactとreact-nativeの型をインストールする

npm i -D @types/react @types/react-native

拡張子を.jsから.tsxに変えてみよう。

これでtypescriptを使い始められる。

expo start
expo ios