Expo
這邊文章已經(jīng)過時了，如果您想在expo中使用ts請到這里https://github.com/janaagaard75/expo-and-typescript來參考如何使用。
當(dāng)我們讀react native文檔時發(fā)現(xiàn)了一個叫Expo的工具，這個工具可以很好的使我們快速的開發(fā)react native應(yīng)用，里面的服務(wù)以及api都可以讓使得我們開發(fā)得到質(zhì)的飛越。通知，OTA, 發(fā)布，原生的一些工能都應(yīng)有盡有。從調(diào)試到發(fā)布以及線上的熱修復(fù)，expo都能為你提供這些服務(wù)。
配合使用TypeScript
TypeScript可以使我們在編寫js的時候像使用其他一些靜態(tài)類型語言一樣，能讓我編寫出更加安全的代碼，不僅如此我們還可以配合vscode，讓你像使用ide一樣去編寫代碼。在expo中你可能也想使用TypeScript，我在官網(wǎng)以及網(wǎng)上都沒找到相關(guān)的資料。后來摸索中發(fā)現(xiàn)可以在app.json中添加下面的代碼就可以使用了TypeScript
"packagerOpts": {
"assetExts": [
"ttf",
"mp4"
],
"sourceExts": [
"ts",
"tsx"
],
"transformer": "node_modules/react-native-typescript-transformer/index.js"
}
這里只是告訴expo一些文件的類型以及轉(zhuǎn)換工具，就像babel的配置那樣。當(dāng)然你要看下你的node_modules中是否有這個轉(zhuǎn)換器react-native-typescript-transformer沒有的話你就要執(zhí)行npm install react-native-typescript-transformer --save-dev了。然后你就可以想網(wǎng)上說的去配置你的typescript的開發(fā)環(huán)境了。比如如何使用@types去增強你的代碼提示，如何使用tslint去增加你的代碼的風(fēng)格檢查，這一切都變得相對簡單了。
配合vscode進行斷點調(diào)試
如果你不喜歡使用chrome調(diào)試你的代碼，當(dāng)然那不是一個最好的選擇，想想一下你可以在vscode里打斷點調(diào)試你的代碼，這是多么爽的體驗。首先你應(yīng)該打開你的調(diào)試配置然后加入下面的代碼
{
// 使用 IntelliSense 了解相關(guān)屬性。
// 懸停以查看現(xiàn)有屬性的描述。
// 欲了解更多信息，請訪問: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Debug in Exponent",
"program": "${workspaceRoot}/.vscode/launchReactNative.js",
"type": "reactnative",
"request": "launch",
"platform": "exponent",
"sourceMaps": true,
"outDir": "${workspaceRoot}/.vscode/.react"
}
]
}
當(dāng)然上面的代碼應(yīng)該是在你的.vscode配置里，如果你對使用vscode調(diào)試不太熟悉，你可以去vscode官網(wǎng)查看詳細教程。
總結(jié)
如果你對我上面說的不太理解,那你應(yīng)該第一步去expo官網(wǎng)查看一些教程，并且使用expo創(chuàng)建一個項目讓它跑起來，第二步你應(yīng)該了解TypeScript以及如何配置它，第三步你應(yīng)該去vscode官網(wǎng)了解如何調(diào)試的一些問題。如果你還是不明白這些東西。你應(yīng)該去github上找到這些項目然后去issues里去查找你的問題，這是一個解決問題比較好的方案。好了，接下來你就可以愉快的編碼了。。。
