带有 React Native 的 Typescript 2.0答案

【问题标题】：Typescript 2.0 with React Native带有 React Native 的 Typescript 2.0
【发布时间】：2017-03-04 18:25:26
【问题描述】：

我刚刚开始使用 Typescript，我正在尝试将它与一个新的 React Native 项目一起使用。但是，我可以让 TS 编译。除了使用 npm @types 之外，我的设置基于 this article。我在我的 IDE (Atom) 中得到了正确的类型提示，但是当我尝试编译时，我得到了以下错误：

node_modules/@types/react-native/index.d.ts(19,24): error TS2307: Cannot find module 'react'.
node_modules/@types/react-native/index.d.ts(222,28): error TS2304: Cannot find name 'Component'.
node_modules/@types/react-native/index.d.ts(1017,15): error TS2304: Cannot find name 'Ref'.
...

我的 package.json

{
  "name": "healthymeIngage",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "react": "15.3.2",
    "react-native": "0.35.0"
  },
  "jest": {
    "preset": "jest-react-native"
  },
  "devDependencies": {
    "@types/react": "^0.14.41",
    "@types/react-native": "^0.29.36",
    "babel-jest": "16.0.0",
    "babel-preset-react-native": "1.9.0",
    "jest": "16.0.2",
    "jest-react-native": "16.0.0",
    "react-test-renderer": "15.3.2",
    "typescript": "^2.0.3"
  }
}

我的 tsconfig.json

{
  "compilerOptions": {
    "module": "es2015",
    "target": "es2015",
    "jsx": "react",
    "outDir": "build",
    "rootDir": "src",
    "allowSyntheticDefaultImports": true,
    "experimentalDecorators": true,
    "noImplicitAny": true,
    "sourceMap": true
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "node_modules/@types/**/*.ts"
  ]
}

【问题讨论】：

我也有同样的问题。你最终找到解决方案了吗？ vscode 也能看到所有内容，但是当我构建它时，它会严重失败

标签： javascript reactjs typescript react-native

【解决方案1】：

我将tsconfig.json文件中的模块系统（"module": "es2015"行）改为：

"module": "commonjs",

这样我的错误就消失了。

【讨论】：

【解决方案2】：

由于您使用的是"typescript": "^2.0.3"，所以报错是由这个报告的issue引起的。对此有解决方法，即使用"moduleResolution": "node"。请注意，之后它不会使经典模块解析适用于包。

@Leone：你的修复 "module": "commonjs" 将不起作用，因为 React Native 附带 ES2015，require() 模块将导致 React Native 中的运行时错误。

【讨论】：