反应原生打字稿模板不起作用

Question

我使用官方命令react-native init MyApp --template typescript(几次(使用打字稿模板创建了一个 React Native 的新项目，但我看不到我在运行应用程序时应用的更改。看起来热重载它在刷新屏幕方面工作，但不应用更改。如果我在没有打字稿的情况下创建应用程序，它的所有工作都正常工作。

我没有收到任何错误，所以我不知道我能做什么。 下面是 package.json，以防此帮助，但它基本上是从typescript template自动生成的文件

{
  "name": "MyApp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "react": "16.6.3",
    "react-native": "0.58.4"
  },
  "devDependencies": {
    "@types/jest": "^24.0.0",
    "@types/react": "^16.8.2",
    "@types/react-native": "^0.57.34",
    "@types/react-test-renderer": "^16.8.0",
    "babel-core": "7.0.0-bridge.0",
    "babel-jest": "24.1.0",
    "jest": "24.1.0",
    "metro-react-native-babel-preset": "0.51.1",
    "react-test-renderer": "16.6.3",
    "ts-jest": "^23.10.5",
    "typescript": "^3.3.3"
  },
  "jest": {
    "preset": "react-native"
  }
}

tsconfig.json

{
  "compilerOptions": {
    "allowJs": true,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "isolatedModules": true,
    "jsx": "react",
    "lib": ["es6"],
    "moduleResolution": "node",
    "noEmit": true,
    "strict": true,
    "target": "esnext"
  },
  "exclude": ["node_modules", "babel.config.js"]
}

任何想法我如何使用打字稿获得反应原生工作。谢谢！

Answer 1

我已经

找到了解决方案，基本上当您使用名为 App (App.js 和 App.tsx 的项目 apperar 2 文件的 ./中的打字稿模板创建 react native 应用程序时，所以基本上让这个工作的解决方案是转到索引.js并替换

每个导入App from './App.tsx'; import App from './App';

索引.js

import {AppRegistry} from 'react-native';
import App from './App.tsx';
import {name as appName} from './app.json';
AppRegistry.registerComponent(appName, () => App);

您还可以解决删除.js文件的问题，以便索引指向 .ts

Answer 2

似乎

您没有执行安装后设置脚本，该脚本负责删除App.js文件。无论如何，这不再是必需的，因为随着 React Native 0.59 的发布，安装后设置脚本会自动执行。