react-native 專案配置ts執行環境
阿新 • • 發佈:2018-12-01
#全域性安裝 create-react-native-app
yarn global add create-react-native-app
#建立專案
create-react-native-app my-app
#安裝ts依賴
yarn add typescript tslint -D yarn add @types/react @types/react-native @types/react-dom -Dyarn add concurrently rimraf -D
#在根目錄下建立一個tsconfig.json配置檔案,或者tsc --init生成預設配置檔案再修改,把下面程式碼貼上去
{ "compilerOptions": { "module":"es2015", "target": "es2015", "jsx": "react", "rootDir": "src", "outDir": "build", "allowSyntheticDefaultImports": true, "noImplicitAny": true, "sourceMap": true, "experimentalDecorators": true, "preserveConstEnums": true, "allowJs": true, "noUnusedLocals": true, "noUnusedParameters": true, "noImplicitReturns": true, "skipLibCheck": true, "moduleResolution": "Node", "baseUrl": "./", "paths": { "assets": ["./assets"] } }, "filesGlob": [ "typings/index.d.ts", "src/**/*.ts", "src/**/*.tsx", "node_modules/typescript/lib/lib.es6.d.ts" ], "types": [ "react", "react-dom", "react-native" ], "exclude":[ "build", "node_modules", "jest.config.js", "App.js", "assets" ], "compileOnSave": false }
#配置指令碼命令,記得先安裝react-native-script
將下面程式碼配置在package.json中
"scripts": { "start": "react-native-scripts start", "eject": "react-native-scripts eject", "android": "react-native-scripts android", "ios": "react-native-scripts ios", "test": "node node_modules/jest/bin/jest.js", "lint": "tslint src/**/*.ts", "tsc": "tsc", "clean": "rimraf build", "build": "yarn run clean && yarn run tsc --", "watch": "yarn run build -- -w", "watchAndRunAndroid": "concurrently \"yarn run watch\" \"yarn run android\"", "buildRunAndroid": "yarn run build && yarn run watchAndRunAndroid ", "watchAndRunIOS": "concurrently \"yarn run watch\" \"yarn run ios\"", "buildRunIOS": "yarn run build && yarn run watchAndRunIOS ", "watchAndStart": "concurrently \"yarn run watch\" \"yarn run start\"", "buildAndStart": "yarn run build && yarn run watchAndStart " },
#最後最重要的在package檔案中把入口地址修改 "main": "./node_modules/react-native-scripts/build/bin/crna-entry.js" #把babel.config檔案放在src下面,在src檔案建立ts檔案,開心的寫專案吧 #yarn buildAndStart啟動服務(複合命令)