zoukankan      html  css  js  c++  java
  • react-native 项目配置ts运行环境

    #全局安装 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 -D

    yarn 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启动服务(复合命令)
  • 相关阅读:
    1-EI-灵魂画手解释安卓的Message对象
    2-VVI-材料设计之TabLayout下标签
    1.安卓基础之Activity生命周期
    golang复制一个指针对象(反射)
    小罗的面试题
    http1.0 、http1.1和http2.0的区别
    HTTP长连接、短连接究竟是什么?
    详解TCP中的拥塞控制
    TCP怎么保证传输的安全性
    ulimit设置完在其他用户上没有生效解决办法
  • 原文地址:https://www.cnblogs.com/w-819/p/10051349.html
Copyright © 2011-2022 走看看