# React NativeにTypeScriptを導入する
2 min read
Table of Contents
TypeScript 関係をインストールする。
npm install -D @tsconfig/react-native @types/jest @types/react @types/react-test-renderer typescript上記コマンドでTypeScriptの依存パッケージをインストールする。
完了するとPackage.jsonが
"devDependencies": { "@babel/core": "^7.20.0" },から
"devDependencies": { "@babel/core": "^7.20.0", "@tsconfig/react-native": "^3.0.2", "@types/jest": "^29.5.4", "@types/react": "^18.2.21", "@types/react-test-renderer": "^18.0.1", "typescript": "^5.2.2" },に更新される。
tsconfig.jsonを作成する
Appのルートにtsconfig.jsonを作成し、
{ "extends": "@tsconfig/react-native/tsconfig.json"}を記述する。
Tsxファイルの作成と動作確認
最後にJavascriptファイルを*.tsxに変換する。
You should leave the ./index.js entrypoint file as it is otherwise you may run into an issue when it comes to bundling a production build.
と公式に書かれていたが、そもそもindex.jsを見つけることができなかったからドキュメントが古い？
App.tsxに型のない関数を書くとtsエラーが出たので、うまく機能していると思われる。
また無事にAppを開けたので、動作も問題ない。
ちなみに、
npx create-expo-app --templateを使えば初期のApp作成時にTypeScriptを導入できるので、こっちでやるべきだった。
