加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

react-native试玩(34)-配置Android开发环境

发布时间:2020-12-15 04:48:19 所属栏目:百科 来源:网络整理
导读:Android Setup Node 之前是安装iojs,现在又改为node了,安装的版本为最新版本4.0: nvm install node ###### ###### ###### ###### ###### ###### ###### ###### ###### ###### ###### ###### 100.0 %Checksums emptyNow using node v4 .0 .0 ( npm v2 .14 .

Android Setup

Node

之前是安装iojs,现在又改为node了,安装的版本为最新版本4.0:

nvm install node
######################################################################## 100.0%
Checksums empty
Now using node v4.0.0 (npm v2.14.2)

react-native-cli

安装新版本的react-native-cli:

npm install -g react-native-cli
/Users/wuxian/.nvm/versions/node/v4.0.0/bin/react-native -> /Users/wuxian/.nvm/versions/node/v4.0.0/lib/node_modules/react-native-cli/index.js
react-native-cli@0.1.4 /Users/wuxian/.nvm/versions/node/v4.0.0/lib/node_modules/react-native-cli
└── prompt@0.2.14 (revalidator@0.1.8,pkginfo@0.3.0,read@1.0.7,winston@0.8.3,utile@0.2.1)

创建新项目

react-native init AwesomeProject
This will walk you through creating a new React Native project in /Users/wuxian/Documents/sourcecode/self/react-native/AwesomeProject

> bufferutil@1.2.1 install /Users/wuxian/Documents/sourcecode/self/react-native/AwesomeProject/node_modules/react-native/node_modules/ws/node_modules/bufferutil
> node-gyp rebuild

  CXX(target) Release/obj.target/bufferutil/src/bufferutil.o
  SOLINK_MODULE(target) Release/bufferutil.node

> utf-8-validate@1.2.1 install /Users/wuxian/Documents/sourcecode/self/react-native/AwesomeProject/node_modules/react-native/node_modules/ws/node_modules/utf-8-validate
> node-gyp rebuild

  CXX(target) Release/obj.target/validation/src/validation.o
  SOLINK_MODULE(target) Release/validation.node

> spawn-sync@1.0.13 postinstall /Users/wuxian/Documents/sourcecode/self/react-native/AwesomeProject/node_modules/react-native/node_modules/yeoman-generator/node_modules/cross-spawn/node_modules/spawn-sync
> node postinstall


> fsevents@0.3.8 install /Users/wuxian/Documents/sourcecode/self/react-native/AwesomeProject/node_modules/react-native/node_modules/babel/node_modules/chokidar/node_modules/fsevents
> node-gyp rebuild

  SOLINK_MODULE(target) Release/.node
  CXX(target) Release/obj.target/fse/fsevents.o
  SOLINK_MODULE(target) Release/fse.node
react-native@0.11.0 node_modules/react-native
├── absolute-path@0.0.0
├── graceful-fs@4.1.2
├── progress@1.1.8
├── stacktrace-parser@0.1.3
├── wordwrap@1.0.0
├── react-timer-mixin@0.13.3
├── underscore@1.7.0
├── image-size@0.3.5
├── bser@1.0.0 (node-int64@0.4.0)
├── semver@4.3.6
├── debug@2.1.0 (ms@0.6.2)
├── chalk@1.0.0 (escape-string-regexp@1.0.3,ansi-styles@2.1.0,supports-color@1.3.1,strip-ansi@2.0.1,has-ansi@1.0.3)
├── yargs@1.3.2
├── optimist@0.6.1 (wordwrap@0.0.3,minimist@0.0.10)
├── promise@7.0.4 (asap@2.0.3)
├── immutable@3.7.5
├── worker-farm@1.3.1 (xtend@4.0.0,errno@0.1.4)
├── source-map@0.1.31 (amdefine@1.0.0)
├── sane@1.2.0 (watch@0.10.0,minimist@1.2.0,exec-sh@0.2.0,fb-watchman@1.6.0,walker@1.0.7,minimatch@0.2.14)
├── rebound@0.0.12
├── uglify-js@2.4.16 (uglify-to-browserify@1.0.2,async@0.2.10,optimist@0.3.7,source-map@0.1.34)
├── connect@2.8.3 (methods@0.0.1,uid2@0.0.2,fresh@0.1.0,pause@0.0.1,cookie-signature@1.0.1,bytes@0.2.0,buffer-crc32@0.2.1,qs@0.6.5,cookie@0.1.0,send@0.1.2,formidable@1.0.14)
├── regenerator@0.8.36 (private@0.1.6,through@2.3.8,recast@0.10.25,commoner@0.10.3,esprima-fb@15001.1.0-dev-harmony-fb,defs@1.1.0)
├── jstransform@11.0.1 (object-assign@2.1.1,base62@1.1.0,source-map@0.4.4,commoner@0.10.3)
├── module-deps@3.5.6 (inherits@2.0.1,shallow-copy@0.0.1,duplexer2@0.0.2,minimist@0.2.0,concat-stream@1.4.10,parents@1.0.1,subarg@0.0.1,readable-stream@1.1.13,through2@0.4.2,resolve@0.7.4,stream-combiner2@1.0.2,browser-resolve@1.9.1,JSONStream@0.7.4,detective@3.1.0)
├── joi@5.1.0 (topo@1.0.3,isemail@1.2.0,hoek@2.15.0,moment@2.10.6)
├── react-tools@0.14.0-beta1 (commoner@0.10.3)
├── ws@0.8.0 (options@0.0.6,ultron@1.0.2,bufferutil@1.2.1,utf-8-validate@1.2.1)
├── yeoman-environment@1.2.7 (escape-string-regexp@1.0.3,log-symbols@1.0.2,diff@1.4.0,text-table@0.2.0,untildify@2.1.0,mem-fs@1.1.0,globby@2.1.0,grouped-queue@0.3.0,lodash@3.10.1,inquirer@0.8.5)
├── yeoman-generator@0.20.3 (path-is-absolute@1.0.0,path-exists@1.0.0,read-chunk@1.0.1,detect-conflict@1.0.0,yeoman-welcome@1.0.1,yeoman-assert@2.1.0,rimraf@2.4.3,async@1.4.2,mime@1.3.4,user-home@2.0.0,xdg-basedir@2.0.0,dargs@4.0.1,nopt@3.0.4,istextorbinary@1.0.2,run-async@0.1.0,mkdirp@0.5.1,shelljs@0.5.3,cli-table@0.3.1,diff@2.1.1,pretty-bytes@2.0.1,through2@2.0.0,underscore.string@3.2.2,dateformat@1.0.11,glob@5.0.14,findup-sync@0.2.1,mem-fs-editor@2.0.4,github-username@2.0.0,class-extend@0.1.1,download@4.2.0,html-wiring@1.2.0,sinon@1.16.1,gruntfile-editor@1.0.0,inquirer@0.8.5,cross-spawn@2.0.0)
├── babel@5.8.21 (slash@1.0.0,path-is-absolute@1.0.0,fs-readdir-recursive@0.1.2,convert-source-map@1.1.1,commander@2.8.1,output-file-sync@1.1.1,chokidar@1.0.5)
└── babel-core@5.8.21 (slash@1.0.0,try-resolve@1.0.1,babel-plugin-remove-console@1.0.1,babel-plugin-inline-environment-variables@1.0.1,babel-plugin-remove-debugger@1.0.1,babel-plugin-eval@1.0.1,babel-plugin-jscript@1.0.4,babel-plugin-property-literals@1.0.1,babel-plugin-member-expression-literals@1.0.1,babel-plugin-undefined-to-void@1.1.6,babel-plugin-react-constant-elements@1.0.3,trim-right@1.0.1,to-fast-properties@1.0.1,shebang-regex@1.0.0,babel-plugin-react-display-name@1.0.3,babel-plugin-constant-folding@1.0.1,babel-plugin-proto-to-assign@1.0.4,babel-plugin-dead-code-elimination@1.0.2,babel-plugin-runtime@1.0.7,private@0.1.6,globals@6.4.1,esutils@2.0.2,home-or-tmp@1.0.0,js-tokens@1.0.1,babel-plugin-undeclared-variables-check@1.0.2,line-numbers@0.2.0,debug@2.2.0,detect-indent@3.0.1,babylon@5.8.23,is-integer@1.0.6,repeating@1.1.3,resolve@1.1.6,minimatch@2.0.10,bluebird@2.10.0,source-map-support@0.2.10,json5@0.4.0,regexpu@1.2.0,regenerator@0.8.35,core-js@1.1.4)
Setting up new React Native app in /Users/wuxian/Documents/sourcecode/self/react-native/AwesomeProject
   create .flowconfig
   create .gitignore
   create .watchmanconfig
   create index.ios.js
   create index.android.js
   create ios/main.jsbundle
   create ios/AwesomeProject/AppDelegate.h
   create ios/AwesomeProject/AppDelegate.m
   create ios/AwesomeProject/Base.lproj/LaunchScreen.xib
   create ios/AwesomeProject/Images.xcassets/AppIcon.appiconset/Contents.json
   create ios/AwesomeProject/Info.plist
   create ios/AwesomeProject/main.m
   create ios/AwesomeProjectTests/AwesomeProjectTests.m
   create ios/AwesomeProjectTests/Info.plist
   create ios/AwesomeProject.xcodeproj/project.pbxproj
   create ios/AwesomeProject.xcodeproj/xcshareddata/xcschemes/AwesomeProject.xcscheme
   create android/app/build.gradle
   create android/app/proguard-rules.pro
   create android/app/src/main/AndroidManifest.xml
   create android/app/src/main/res/values/strings.xml
   create android/app/src/main/res/values/styles.xml
   create android/build.gradle
   create android/gradle.properties
   create android/settings.gradle
   create android/app/src/main/res/mipmap-hdpi/ic_launcher.png
   create android/app/src/main/res/mipmap-mdpi/ic_launcher.png
   create android/app/src/main/res/mipmap-xhdpi/ic_launcher.png
   create android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png
   create android/gradle/wrapper/gradle-wrapper.jar
   create android/gradle/wrapper/gradle-wrapper.properties
   create android/gradlew
   create android/gradlew.bat
   create android/app/src/main/java/com/awesomeproject/MainActivity.java
To run your app on iOS:
   Open /Users/wuxian/Documents/sourcecode/self/react-native/AwesomeProject/ios/AwesomeProject.xcodeproj in Xcode
   Hit Run button
To run your app on Android:
   Have an Android emulator running,or a device connected
   cd /Users/wuxian/Documents/sourcecode/self/react-native/AwesomeProject
   react-native run-android

目录结构:

android-sdk

安装android-sdk,并添加到环境变量中:
“`
sudo brew install android-sdk
Warning: Formula file is modified!
Building from source because Library/Formula/android-sdk.rb has local changes
To install from a bottle instead,run with –force-bottle
==> Downloading https://dl.google.com/android/android-sdk_r24.3.3-macosx.zip
Already downloaded: /Library/Caches/Homebrew/android-sdk-24.3.3.zip
==> Downloading https://android.googlesource.com/platform/sdk/+/7859e2e738542baf

################################################################## 100.0%

==> Caveats
Now run the ‘android’ tool to install the actual SDK stuff.

The Android-SDK is available at /usr/local/opt/android-sdk

You will have to install the platform-tools and docs EVERY time this formula
updates. If you want to try and fix this then see the comment in this formula.

You may need to add the following to your .bashrc:
export ANDROID_HOME=/usr/local/opt/android-sdk

Bash completion has been installed to:
/usr/local/etc/bash_completion.d
Warning: Could not fix /tmp/android-build-build-temp-99769/install-darwin-x86_64/lib/libz.1.dylib in /usr/local/Cellar/android-sdk/24.3.3/tools/qemu/darwin-x86_64/qemu-system-aarch64
Warning: Could not fix /tmp/android-build-build-temp-99769/install-darwin-x86_64/lib/libz.1.dylib in /usr/local/Cellar/android-sdk/24.3.3/tools/qemu/darwin-x86_64/qemu-system-mips64el
Warning: Could not fix /tmp/android-build-build-temp-99769/install-darwin-x86_64/lib/libz.1.dylib in /usr/local/Cellar/android-sdk/24.3.3/tools/qemu/darwin-x86_64/qemu-system-x86_64
==> Summary

运行

这个地方要注意,需要更新watchman到3.7和执行adb reverse tcp:8081 tcp:8081(仅支持5.0后),运行效果如下:

注意

5.0以下的手机可以通过wifi连接,然后在Dev Settings中配置JS bundle的地址。

开发者菜单

摇晃手机或者点击菜单栏

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读