怎么在ReactNative里面使用Typescript
发布时间：2020-12-15 05:30:11 所属栏目：百科 来源：网络整理
导读：今天来搞一搞怎么搭建一个可以使用Typescript的ReactNative环境好吧，一句废话不多说，直接开始好吧 1.全局安装create-react-native-app yarn global add create-react-native-app ? ? div class="cnblogs_code" 例如：create-react-native-app myApp 5.继续
|
今天来搞一搞怎么搭建一个可以使用Typescript的ReactNative环境好吧，一句废话不多说，直接开始好吧 1.全局安装create-react-native-app yarn global add create-react-native-app
? ? <div class="cnblogs_code"> 例如：create-react-native-app myApp
5.继续安装其他依赖 6.通过tsc --init生成tsconfig.json，或者手动创建一个tsconfig.json，将下面代码拷入该文件
"compilerOptions""module":"es2015""target": "es2015""jsx": "react""rootDir": "src""outDir": "build""allowSyntheticDefaultImports": "noImplicitAny": "sourceMap": "experimentalDecorators": "preserveConstEnums": "allowJs": "noUnusedLocals": "noUnusedParameters": "noImplicitReturns": "skipLibCheck": "moduleResolution":"Node""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"
],</span>"compileOnSave": <span style="color: #0000ff">false</span><span style="color: #000000">
} ?7.安装react-native-scripts yarn add react-native-scripts
8.将package.json中的"scripts"配置清空，并将以下代码替换
"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 "
9.将package.json中的"main"配置清空替换为以下代码 "main": "./node_modules/react-native-scripts/build/bin/crna-entry.js"
10.将App.js中代码清空，并将以下代码替换 import App from './build/App' App;
11.创建一个src文件夹，将babel.config.js文件放在src文件夹下，同时在src文件夹下创建一个App.tsx文件，App.tsx文件中代码如下 import React,{ Component } from "react""react-native"export <span style="color: #0000ff">default<span style="color: #000000"> class App extends Component {
render() { <span style="color: #0000ff">return<span style="color: #000000">( 12.执行yarn buildAndStart即可
（编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |