Typescript 2.0 с React Native

#javascript #reactjs #typescript #react-native

#javascript #reactjs #typescript #react-native

Вопрос:

Я только начинаю работать с Typescript и пытаюсь использовать его в новом проекте React Native. Однако я могу заставить TS скомпилироваться. Я основал свои настройки на этой статье, за исключением использования npm @types. Я получаю правильную подсказку типа в моей 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'.
...
  

Мой пакет.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"
  ]
}
  

Комментарии:

1. У меня такая же проблема. В итоге вы нашли решение? vscode тоже все видит, но при сборке он резко выходит из строя

Ответ №1:

Поскольку вы используете "typescript": "^2.0.3" , ошибка вызвана этой сообщаемой проблемой. Для этого есть обходной путь, который заключается в использовании "moduleResolution": "node" . Имейте в виду, что впоследствии это не приведет к работе с классическим разрешением модуля для пакетов.

@Leone: ваше исправление "module": "commonjs" не будет работать, поскольку React Native поставляется с модулями ES2015 , require() которые будут вызывать ошибки во время выполнения в React Native.

Ответ №2:

Я изменил систему модулей (строку "module": "es2015" ) в tsconfig.json файле на:

 "module": "commonjs",
  

Таким образом, ошибки для меня исчезли.