快速搭建 TypeScript 和 React Native 的开发环境

[ljunb]

trafficstars

• 1 新建一个 React Native 项目，并 cd 到根目录；
• 2 添加必要的依赖：

yarn add @types/react @types/react-native
yarn add --dev react-native-typescript-transformer typescript 

or

npm install --save @types/react @types/react-native
npm install --save-dev react-native-typescript-transformer typescript

• 3 新建 tsconfig.json 文件：

{
  "compilerOptions": {
    "module": "es2015",
    "target": "es2015",
    "jsx": "react-native",
    "moduleResolution": "node",
    "allowSyntheticDefaultImports": true
  }
}

• 4 新建 rn-cli.config.js 文件：

module.exports = {
  getTransformModulePath() {
    return require.resolve('react-native-typescript-transformer');
  },
  getSourceExts() {
    return ['ts', 'tsx'];
  },
};

• 5 新建测试页面，以 tsx 为后缀命名，修改 React 的引用方式：

import * as React from 'react';
import { Component } from 'react';

[syanbo]

可以使用 --template react-native init MyApp --template typescript

[ljunb]

@syanbo 新版功能咩，好久没关注