React   发布时间:2019-10-13  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了怎么在ReactNative里面使用Typescript大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
@H_618_0@今天来搞一搞怎么搭建一个可以使用Typescript的ReactNative环境好吧,一句废话不多说,直接开始好吧@H_618_1@
@H_618_0@1.全局安装create-react-native-app@H_618_1@
yarn global add create-react-native-app

@H_618_0@你的项目名称     @H_618_1@ @H_618_0@<div class="cnblogs_code">@H_618_1@
例如:create-react-native-app  myApp
@H_618_0@  @H_618_1@
@H_618_0@你的项目文件夹中,准备安装typeScript依赖@H_618_1@
@H_618_0@@H_618_1@

@H_618_0@5.继续安装其他依赖@H_618_1@

@H_618_0@6.通过tsc --init生成tsconfig.json,或者手动创建一个tsconfig.json,将下面代码拷入该文件@H_618_1@ @H_618_0@  @H_618_1@
{ "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"&gt;false</span><span style="color: #000000"&gt; @H_618_0@}@H_618_1@

@H_618_0@ 7.安装react-native-scripts@H_618_1@
yarn add react-native-scripts
@H_618_0@8.将package.json中的"scripts"配置清空,并将以下代码替换@H_618_1@ @H_618_0@ @H_618_1@
"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 "

@H_618_0@9.将package.json中的"main"配置清空替换为以下代码@H_618_1@
"main": "./node_modules/react-native-scripts/build/bin/crna-entry.js"

@H_618_0@10.将App.js中代码清空,并将以下代码替换@H_618_1@
import App from './build/App' App;

@H_618_0@11.创建一个src文件夹,将babel.config.js文件放在src文件夹下,同时在src文件夹下创建一个App.tsx文件,App.tsx文件中代码如下@H_618_1@
import React,{ Component } from "react"{ View,Text } from "react-native"618_0@export <span style="color: #0000ff">default<span style="color: #000000"> class App extends Component {
render() {
<span style="color: #0000ff">return<span style="color: #000000">(
@H_450_154@@H_618_1@ 红牛维生素功能饮料

@H_618_0@12.执行yarn buildAndStart即可@H_618_1@ @H_618_0@  @H_618_1@ @H_618_0@  require,这个问题暂时不知道原因@H_618_1@

大佬总结

以上是大佬教程为你收集整理的怎么在ReactNative里面使用Typescript全部内容,希望文章能够帮你解决怎么在ReactNative里面使用Typescript所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: