14

我找不到有关如何安装和运行“ https://github.com/facebook/react-native/tree/master/Examples ”中提供的其他示例之一的任何说明,例如“ https://github. com/facebook/react-native/tree/master/Examples/Movies '。

本教程只告诉你做

react-native init AwesomeProject

它抓住了' https://github.com/facebook/react-native/tree/master/Examples/SampleApp '。


如果我克隆整个“react-native”存储库,然后运行

npm install
npm start

从根文件夹(即“/react-native”),然后在 Xcode 中打开“/react-native/Examples/Movies/Movies.xcodeproj”,然后运行项目,似乎构建良好。模拟器出现,显示应用程序的“电影”介绍屏幕,但随后出现红色死亡屏幕,并打印出:

:0

和终端,其中 'npm start' 在根文件夹中运行,打印出:

Error: EISDIR, read
    at Error (native)
[02:35:02] <START> request:/Examples/Movies/MoviesApp.includeRequire.runModule.bundle
4

9 回答 9

21

它应该只需按照Getting Started Tutorial即可工作,但您必须npm install在 react-native 目录中运行。

然后只需运行例如带有 Xcode 的电影项目。

如果您想“隔离” MovieProject 或另一个 react-native 示例项目,简单的方法是启动一个新的 react native 应用程序react-native init MyAppName(新的应用程序文件夹。

然后不要忘记编辑您的 iOS/AppDelegate.m 文件。

您必须编辑 2 行:

jsCodeLocation = [NSURL URLWithString:@"http:/localhost:8081/index.ios.bundle"];

经过:

jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/MoviesApp.bundle"];

RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                  moduleName:@"MyAppName"
                                               launchOptions:launchOptions];

经过:

RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                  moduleName:@"MoviesApp"
                                               launchOptions:launchOptions];

于 2015-03-29T21:18:36.803 回答
6

一、满足入门指南的要求

然后,查看React Native存储库并在其中运行以下代码:

  1. npm install
  2. open Examples/Movies/Movies.xcodeproj

如果由于链接错误而导致编译错误,则删除派生数据可能会有所帮助。退出 Xcode,删除/Users/{you}/Library/Developer/Xcode/DerivedData,然后重新打开 Xcode。

于 2015-03-30T01:27:14.323 回答
4

此外,您可以通过运行以下命令来运行 UIExplorer 应用程序的 android 版本:

./gradlew :Examples:UIExplorer:android:app:installDebug
./packager/packager.sh

或这个:

./gradlew :Examples:Movies:android:app:installDebug
./packager/packager.sh

对于电影示例(应该在 react-native 文件夹上运行)。

此外,您可以运行 gradle 守护程序来加快 Android 的构建时间。

于 2015-11-10T17:09:54.680 回答
3

您必须在终端中安装 node.js

brew install node

ReactNative 使用 Node.js 在项目内部构建 Javascript 代码。

然后你需要 Watchman,一个来自 Facebook 的文件观察器

brew install watchman

当代码发生变化时,React Native 使用 Watchman 来重建你的代码。

最后一件事是在 react-native 文件夹中安装和运行带有终端窗口的节点。

npm install
npm start

现在您可以从 Xcode 中的 react-native/Examples 文件夹中打开一个项目,然后构建并运行它。

于 2015-03-29T09:08:32.973 回答
2

1) 打开终端并 cd 到您要运行的具体示例 cd home/XYZ/react-native-master/Examples/UIExplorer

2) 运行 npm 安装

3) 运行 npm start

4) 在 Xcode 中打开示例并从那里运行它应该可以正常工作。

PS:这很简单,但是很多答案也误导了我。

于 2016-03-11T12:17:55.873 回答
1
  1. 酿造更新
  2. 冲泡安装节点
  3. brew升级节点(如果你已经安装)
  4. 酿造安装守望者
  5. npm install -g react-native-cli
  6. react-native init [name ur app] --version 0.24.0(取决于你想使用的版本,如果它不能在下面使用)(6)。react-native init [name ur app] --verbose
  7. cd [命名你的应用程序]
  8. 打开 。
  9. npm 开始
  10. 原子。(如果你安装了原子)
于 2016-07-22T10:02:02.563 回答
0

这是创建简单应用程序的分步教程。

1)首先下载cli工具

2) npm 运行开始

3)在xcode IOS模拟器中启动app。

教程在这里:http ://www.syntaxsuccess.com/viewarticle/553844b55bbbb6000031f0f9

于 2015-04-23T02:46:16.240 回答
0

只是想为像我这样试图运行现有的 react-native 项目/应用程序的人更新这个:

在终端:

  1. npm 安装
  2. npm start (应该打开一个单独的窗口来运行反应包管理器,或者它可能使用现有的终端窗口,如果是这种情况,您需要打开一个新的终端窗口来输入步骤 3 的命令)
  3. react-native run-ios/react-native run-android

**您可能需要运行 npm update -g (在 react native 文件夹中)以确保在运行 npm install 之前所有 npm 包都是最新的

于 2017-04-24T16:06:30.387 回答
-1

在 Windows 10 上,我必须adb shell am start -n com.facebook.react.movies/.MoviesActivity让示例运行。(确保ANDROID_SDK\platform-tools在路径中或使用绝对路径运行命令)

所以我必须一步一步地做:

cd react-native

./gradlew :Examples:Movies:android:app:installDebug

adb shell am start -n com.facebook.react.movies/.MoviesActivity

./packager/packager.sh

或者

./gradlew :Examples:UIExplorer:android:app:installDebug

adb shell am start -n com.facebook.react.uiapp/.UIExplorerActivity

./packager/packager.sh
于 2016-04-05T10:41:07.983 回答