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

我找到了解决方案，基本上，当您使用项目appar 2文件（名为App（）中的 typescript模板创建 react nativ e应用时， App.js和App.tsx），因此基本上可以解决此问题的解决方案是转到index.js并替换

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

index.js

import {AppRegistry} from 'react-native';
import App from './App.tsx';
import {name as appName} from './app.json';

AppRegistry.registerComponent(appName, () => App);

您也可以解决删除 .js 文件的问题，这样索引将指向 .ts

React Native Typescript模板不起作用

1 个答案: