1. 程式人生 > >React-Native 一:學習

React-Native 一:學習

一、下載並執行一個github專案
1,下載,例如:
HelloRn
2,使用WebStorm開啟專案
3,在Terminal中執行命令
npm install : 執行該命令是下載node_modules。每個專案都要執行該命令,下載node_modules。(可以用yarn install命令代替)等待若干時間下載,,,
react-native run-android:該命令用來執行Android專案
以上三步基本上都能把github專案執行成功,如果遇到錯誤,可以自行通過提示解決。
二、執行模擬器
1,檢視模擬器地址

1.1、android list avd:該命令能檢視到模擬器的名字和地址

eg:

 Name: Nexus_5_API_25
Device: Nexus 5 (Google)
Path: C:\Users\DELL.android\avd\Nexus_5_API_25.avd
Target: Google APIs (Google Inc.)
Based on: Android 7.1.1 (Nougat) Tag/ABI: google_apis/armeabi-v7a
Skin: nexus_5
Sdcard: 100M

1.2、emulator -list-avds:該命令可以檢視存在的模擬器
eg:
Nexus_5_API_25
Nexus_6P_API_25

2,執行模擬器
進入模擬器目錄我的目錄是:(C:\Users\xxx\AppData\Local\Android\Sdk\emulator),(Windows10通過按住Shift鍵,再滑鼠右鍵“在此處開啟Powershell視窗”),最後執行如下命令,例如
eg:emulator -avd Nexus_5_API_25

三、排錯
1,has incorrect peer dependency:有不正確的對等依賴

warning " > react-test-renderer@16.4.2" has incorrect peer dependency "react@^16.0.0".

說白了就是,[email protected]版本與[email protected]版本

相關推薦

React-Native 學習

一、下載並執行一個github專案 1,下載,例如: HelloRn 2,使用WebStorm開啟專案 3,在Terminal中執行命令 npm install : 執行該命令

react native ()

中文 cnblogs display back padding 分享 index pac round 開始接觸app方面的工作,真心塞~又開始了周而復始的死磕一個問題專坐一整天的節奏,關鍵是還沒有成績,實在無語。╮(╯▽╰)╭,還是總結一下最近心塞歷程吧……react na

hybrid app初體驗,和react-native起飛

第一次啟動了react-native的示例,今天主要把其中遇到的坑與解決的辦法分享給大家。如有疏漏、錯誤還望指正。 首先還是要從hybrid app這個概念說起(如果對於這個過程不感興趣的同學,可以直接往下翻,從開始配置react-native看起)。hybrid app就是混合應用

react-native Modal的學習與使用

原生有Dialog,Toast之類的彈窗控制元件,React-Native雖然也有Dialog,但是並不好用,所幸有Modal這個元件,使用起來簡單,而且還比較好用。 之前一直有知道這個控制元件,但因為沒有需要用到所以沒有看過如何使用,今天同事有需要,就看了一下,寫了個de

React-Native部分API學習

一、react-navigation 1、常見的導航分類 StackNavigator :類似於普通的Navigator,螢幕上方導航欄  TabNavigator:obviously, 相當於iOS裡面的TabBarController,螢幕下方標籤欄  D

react-native 種簡明構建複雜三元運算邏輯的方法

    react native不使用Redux、Flex的情形下,rn區別於網頁程式設計的一個不同點在於,使用者介面的樣式構建可能不再需要套用既定的樣式表了。rn幾乎沒有什麼太多的樣式繼承的情況下,程式碼分兩個地方寫起來,頻繁測試時滾動編輯器頁面實在令人感到惱火,真的不如

React Native :開發環境搭建 填坑

[email protected]:~/AwesomeProject$ react-native run-android Starting JS server... Building and installing the app on the devi

React-Native TabBarIOS的學習

1.專案目錄結構: 2.程式碼實現: (1) index.ios.js /** * Sample React Native App * https://github.com/facebook/react-native * @flow *

React Native 跨平臺開發學習路線

你的電腦若未安裝Homebrew、Node.js、WatchMan等工具,請參照:若已安裝Homebrew、Node.js、WatchMan,請直接:對於IDE/Editor的選擇,目前可以有Sublime Text、VSCode、WebStorm、Atom+Nuclide選擇。我個人使用的是VSCode和P

react-native開發執行react-native run-ios報錯--Print: Entry, ":CFBundleIdentifier", Does Not Exist

情景 在新建立的ReactNative專案,執行命令:react-native init Hello 在專案資料夾下執行react-native run-ios,但是出現以下報錯: Command /bin/sh failed with exit c

React-Native開發react-native-file-selector選擇檔案元件的使用(安卓)

為了上傳檔案,搜尋了很多資料終於找到選擇本地檔案並獲取到具體路徑的元件,可以在github上查詢到該元件 以下為該元件使用前的引入工作: 1、npm install react-native-file-selector --save 2、react

ReactNative學習開發之圖標庫react-native-vector-icons

git con www http tps ati https ionic 今天 GitHub地址:https://github.com/oblador/react-native-vector-icons iOS 參考:http://www.jianshu.com/p/4

ReactNative學習之控件react-native-calendars

wix 當前日期 sign for extra sta .com hid 默認 GitHub:https://github.com/wix/react-native-calendars 屬性介紹: current:設置當前日期,當前日期不設置默認是當日 minDate&

React Native學習() 環境搭建

需安裝工具 RN環境: [必須] Node [必須] react-native-cli [可選] Node Package Manager(npm):node包管理工具,一般安裝Node會帶上npm * [可選] Node Version Manager(nvm):node版本管理工具 *

React學習()React入門

一 React 的優點 1.響應式渲染 React 最大的優點在於其響應式渲染,相對於傳統的更新整個頁面的緩慢而言,React 會生成一個虛擬的DOM,當用戶進行操作使狀態有所變化時,React會計算

React Native基礎&入門教程除錯React Native應用的小步

React Native(以下簡稱RN)為傳統前端開發者打開了一扇新的大門。其中,使用瀏覽器的除錯工具去Debug移動端的程式碼,無疑是最吸引開發人員的特性之一。 試想一下,當你在手機螢幕按下一個按鈕,處理事件的程式碼就可以立即在瀏覽器的除錯工具裡進行斷點除錯,而且每當你對程式碼進行修改,介面便可以完成

React Native學習筆記2Android環境搭建

背景 各位童鞋有木有感覺官方文件很坑啊,根據官網的描述,首先在chocolate就直接卡死了,VPN沒什麼卵用,於是逐個去官網下載,直到昨天才發現不用VPN也可以下!公司是windows環境,這裡就先用windows搭建。 因為本身是移動開發者,所以

React-Native學習:環境搭建

3、 建議安裝WatchMan WatchMan是由Facebook提供的監視檔案系統變更的工具。安裝此工具可以提高開發時的效能(packager可以快速捕捉檔案的變化從而實現實時重新整理) $brew install watchman 終端提示正在下載watchMan,下載成功頁面如下:

React-Native學習筆記之導航器Navigator實現頁面間跳轉

Navigator用來實現不同頁面的切換,想設定Navigator,必須確定一個或多個呼叫routes物件,去定義每個場景。 還可以利用renderScene方法,導航欄可以根據指定的路由來渲染場景。

Android NDK(JNI)學習總結Java程式碼中申明native函式-Java呼叫C函式,並在C函式中訪問java類和方法、屬性

本文不涉及android-ndk開發環境搭。 步驟一:新建一個APP,名稱為HelloJNI,然後定義一個類(將會在native程式碼中呼叫和訪問該類): package com.example.hellojni; public class JNITe