运行react native ios app

时间:2017-05-06 05:30:47

标签: ios node.js reactjs react-native

所以我想使用npm react-native-router-flux来安装一个依赖项,但由于它的兼容性版本与react&反应原生,它打破了我的项目应用程序。所以我从package.json文件中删除了它。

尝试删除它:

npm uninstall --save react-native-router-flux

甚至尝试从package.json文件中手动删除它,但由于某种原因,现在看起来我的整个项目因此而中断。 现在每当我做npm start

这是我的终端显示的内容:

error: bundling: Error: ENOENT: no such file or directory, open '/Users/marian-mac/Documents/dev/example/myapp/node_modules/react-native-router-flux/node_modules/react-native/Libraries/Components/ActivityIndicator/ActivityIndicator.js'
    at Error (native)
    at Object.fs.openSync (fs.js:634:18)
    at Object.fs.readFileSync (fs.js:502:33)
    at Module._readSourceCode (/Users/marian-mac/Documents/dev/example/myapp/node_modules/react-native/packager/src/node-haste/Module.js:200:29)
    at Module._getCacheProps (/Users/marian-mac/Documents/dev/example/myapp/node_modules/react-native/packager/src/node-haste/Module.js:420:29)
    at Module._readFromTransformCache (/Users/marian-mac/Documents/dev/example/myapp/node_modules/react-native/packager/src/node-haste/Module.js:376:29)
    at Module.readCached (/Users/marian-mac/Documents/dev/example/myapp/node_modules/react-native/packager/src/node-haste/Module.js:363:25)
    at Promise.resolve.then (/Users/marian-mac/Documents/dev/example/myapp/node_modules/react-native/packager/src/node-haste/DependencyGraph/ResolutionRequest.js:167:29)
    at process._tickCallback (internal/process/next_tick.js:103:7)
Bundling `index.ios.js`  94.0% (2941/3033)

我尝试rm -rf / node_modules 100次,然后npm再安装100次,这样会一直失败并失败,我无法理解在哪里尝试访问该文件!如果它被删除!

这是我的package.json现在:

{
  "name": "myapp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "moment": "^2.18.1",
    "native-base": "^2.1.3",
    "react": "16.0.0-alpha.6",
    "react-native": "0.44.0",
    "react-native-flags": "^1.0.0"
  },
  "devDependencies": {
    "babel-jest": "19.0.0",
    "babel-preset-react-native": "1.9.1",
    "jest": "19.0.2",
    "react-test-renderer": "16.0.0-alpha.6"
  },
  "jest": {
    "preset": "react-native"
  }
}

也会为版本和其他东西抛出警告:

npm WARN native-base-shoutem-theme@0.1.3 requires a peer of react@>=15.1.0 but none was installed.
npm WARN @shoutem/animation@0.8.10 requires a peer of react@^15.0.0 but none was installed.
npm WARN react-static-container@1.0.1 requires a peer of react@^0.13.0 || ^0.14.0 || ^15.0.0 but none was installed.

这是针对本机基础依赖的:

 UNMET PEER DEPENDENCY react@^0.13.0 || ^0.14.0 || ^15.0.0

任何人都可以帮助我吗?这让我很生气,现在已经打了好几个小时,我无法继续使用我的应用程序。

提前致谢。

修改

更改了一些版本的反应,反应原生和本机基础。仍然有警告,看起来像打包器正在尝试访问react-native-route-flux中的react-native文件。

1)这是我目前的package.json

{
  "name": "myapp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "moment": "^2.18.1",
    "native-base": "^2.1.3",
    "react": "16.0.0-alpha.3",
    "react-native": "^0.43.0",
    "react-native-flags": "^1.0.0"
  },
  "devDependencies": {
    "babel-jest": "19.0.0",
    "babel-preset-react-native": "1.9.1",
    "jest": "19.0.2",
    "react-test-renderer": "16.0.0-alpha.6"
  },
  "jest": {
    "preset": "react-native"
  }
}

2)这些是警告:

npm WARN react-native@0.43.4 requires a peer of react@16.0.0-alpha.6 but none was installed.
npm WARN native-base-shoutem-theme@0.1.3 requires a peer of react@>=15.1.0 but none was installed.
npm WARN @shoutem/animation@0.8.10 requires a peer of react@^15.0.0 but none was installed.
npm WARN react-static-container@1.0.1 requires a peer of react@^0.13.0 || ^0.14.0 || ^15.0.0 but none was installed.
npm WARN react-test-renderer@16.0.0-alpha.6 requires a peer of react@^16.0.0-alpha.6 but none was installed.

还会在原生基础上抛出一些UNMET PEER DEPENDENCY:

├─┬ native-base@2.1.3
│ ├─┬ @shoutem/animation@0.8.10
│ │ ├── hoist-non-react-statics@1.2.0
│ │ └── lodash@4.17.4
│ ├── blueimp-md5@2.7.0
│ ├── clamp@1.0.1
│ ├─┬ color@0.11.4
│ │ ├── clone@1.0.2
│ │ ├─┬ color-convert@1.9.0
│ │ │ └── color-name@1.1.2
│ │ └── color-string@0.3.0
│ ├─┬ fs-extra@2.1.2
│ │ └── jsonfile@2.4.0
│ ├── lodash@4.11.2
│ ├── native-base-shoutem-theme@0.1.3
│ ├── print-message@2.1.0
│ ├── UNMET PEER DEPENDENCY react@^15.0.0
│ ├── react-native-drawer@2.3.0
│ ├── react-native-easy-grid@0.1.7
│ ├── react-native-keyboard-aware-scroll-view@0.2.7
│ ├─┬ react-native-scrollable-tab-view@0.7.4
│ │ ├── UNMET PEER DEPENDENCY react@^0.13.0 || ^0.14.0 || ^15.0.0
│ │ └── react-static-container@1.0.1
│ ├── react-native-vector-icons@4.0.1
│ ├─┬ react-tween-state@0.1.5
│ │ └─┬ raf@3.3.2
│ │   └── performance-now@2.1.0
│ └── tween-functions@1.2.0
├─┬ UNMET PEER DEPENDENCY react@16.0.0-alpha.3

在运行时的控制台中,在XCode的模拟器中抛出红屏错误:

No Dimension set for key window

根据他的github看,它是known issue。但是,该死的,我不想再使用react-native-router-flux,我甚至没有在我的package.json中安装它并且仍然会造成麻烦,这种依赖是一种病毒。

2 个答案:

答案 0 :(得分:4)

每当你面对这样的情况时,只要冷静下来,并考虑安装核心第三方后所有其他第三方的安装情况。我在玩react-native-router-flux时遇到了类似问题,其稳定版本为v3.38.0

从上面的问题来看,似乎@shoutem/animation@0.8.10react-static-container@1.0.1来自react-native-router-flux lib。另一个包native-basereact@>=15.1.0

兼容

所以我得出结论,从节点模块中删除@shoutemreact-static-container。如果仍然存在错误,那么我很确定错误是因为本机基础。从项目中完全删除native base并等待native base更新到最新版本的react

尝试以上内容并请分享进展,因为这也可以帮助其他人。

注意1:每当您在安装软件包时看到警告,请不要忽略这些警告,因为它们可能会破坏某些软件包的功能。

使用npm install package-name@x.y更新软件包,其中x.y是您要安装的版本号。

注意2:首选安装包yarn

以下是使用react-native-router-flux更新或安装的依赖项:

"dependencies": {
    "lodash.isequal": "^4.5.0",
    "react": "^15.4.2",
    "react-addons-pure-render-mixin": "^15.4.2",
    "react-dom": "^15.4.2",
    "react-native": "^0.41.2",
    "react-native-experimental-navigation": "0.26.x",
    "react-native-tabs": "^1.0.9",
    "react-static-container": "1.0.1"
  },

正如您所看到的,react-static-container继承自react-native-router-flux而其他错误来自native-base,请参阅native-base提供的以下依赖项。

"dependencies": {
    "@shoutem/animation": "^0.8.9",
    "native-base-shoutem-theme": "0.1.3",
    "blueimp-md5": "^2.5.0",
    "clamp": "^1.0.1",
    "color": "~0.11.1",
    "fs-extra": "^2.0.0",
    "lodash": "~4.11.1",
    "print-message": "^2.1.0",
    "react-native-easy-grid": "0.1.7",
    "react-native-keyboard-aware-scroll-view": "0.2.7",
    "react-native-scrollable-tab-view": "^0.7.1",
    "react-native-vector-icons": "~4.0.0",
    "react-tween-state": "^0.1.5",
    "tween-functions": "^1.0.1",
    "react-native-drawer": "^2.3.0"
  },

干杯:)

答案 1 :(得分:0)

npm install react-native-reanimated 
react-native-gesture-handler 
react-native-screens 
react-native-safe-area-context 
@react-native-community/masked-view