Cordova 快速入門記錄

本篇文章由:http://xinpure.com/cordova-quick-start-recording/html

記一筆

Cordova 官網入門文檔 Get Started Fast,言簡意該、通俗易懂。android

在此僅記錄過程及安裝時遇到的問題,作個記念什麼的也好。ios

開始使用

徹底就是根據官方文檔,敲敲命令而已git

安裝 Cordova

xinpureZhu:cordova xinpure$ sudo npm install -g cordova

建立項目

xinpureZhu:cordova xinpure$ cordova create MyApp

Creating a new cordova project.

添加平臺支持

Cordova 現支持的平臺 amazon-fireos, android, blackberry10, browser, firefoxos, ios, osx, webosgithub

這裏便隨着文檔,選擇了 browserweb

xinpureZhu:cordova xinpure$ cd MyApp/

xinpureZhu:MyApp xinpure$ ls

config.xml  hooks       platforms   plugins     www

xinpureZhu:MyApp xinpure$ cordova platform

Installed platforms:

Available platforms: amazon-fireos, android, blackberry10, browser, firefoxos, ios, osx, webos

xinpureZhu:MyApp xinpure$ cordova platform add browser

Adding browser project...

Creating Browser project. Path: platforms/browser

Discovered plugin "cordova-plugin-whitelist" in config.xml. Installing to the project

Fetching plugin "cordova-plugin-whitelist@1" via npm

Installing "cordova-plugin-whitelist" for browser

啓動 App

xinpureZhu:MyApp xinpure$ cordova run browser

Running command: /Project/cordova/MyApp/platforms/browser/cordova/run

Static file server running on port 8000 (i.e. http://localhost:8000)

CTRL + C to shut down

Static file server running @ http://localhost:8000/index.html

CTRL + C to shut down

Executing command: open -n -a "Google Chrome" --args --user-data-dir=/tmp/temp_chrome_user_data_dir_for_cordova http://localhost:8000/index.html

到此,Cordova 快速入門便結束了,確實比較簡單的chrome

爲項目添加 ios 平臺支持

WebApp 固然仍是要在手機上跑起來纔到位,這裏使用 ios 嚐嚐鮮apache

爲項目添加ios平臺

xinpureZhu:MyApp xinpure$ cordova platform add ios

Adding ios project...

iOS project created with cordova-ios@3.9.1

Installing "cordova-plugin-whitelist" for ios

以新平臺啓動App

xinpureZhu:MyApp xinpure$ cordova run ios

Running command: /Project/cordova/MyApp/platforms/ios/cordova/run

ios-sim was not found. Please download, build and install version 3.0.0 or greater from https://github.com/phonegap/ios-sim into your path, or do 'npm install -g ios-sim'

ERROR running one or more of the platforms: Error: /Project/cordova/MyApp/platforms/ios/cordova/run: Command failed with exit code 2

You may not have the required environment or OS to run this project

執行命令終於不是那麼順暢了,缺乏 ios-sim 模塊 (解決方法已清楚的提示,因此也不算是問題啦)npm

按提示執行命令:api

xinpureZhu:MyApp xinpure$ sudo npm install -g ios-sim

安裝完成後再從新執行啓動命令:

xinpureZhu:MyApp xinpure$ cordova run ios

Running command: /Project/cordova/MyApp/platforms/ios/cordova/run

simctl was not found.

Check that you have Xcode 6.x installed:

    xcodebuild --versionCheck that you have Xcode 6.x selected:
    xcode-select --print-path

ERROR running one or more of the platforms: Error: /Project/cordova/MyApp/platforms/ios/cordova/run: Command failed with exit code 2

You may not have the required environment or OS to run this project

好吧,看到這個錯誤提示,個人心裏是茫然的。

我使用的是 Mac OS X EI Capitan, Xcode 也更新到了 7.0.1, 何故如此?

再次 查看文檔後發現不一樣於 bowser 平臺,ios平臺須要先 build

其實以前也看到過 build 這一操做,可是思惟定勢,想固然的覺得 cordova run 會同時執行 cordova build,然而並非。

Build App

xinpureZhu:MyApp xinpure$ cordova platform ls

Installed platforms: browser 4.0.0, ios 3.9.1

Available platforms: amazon-fireos, android, blackberry10, firefoxos, osx, webos

xinpureZhu:MyApp xinpure$ cordova build ios

...此處省略一連串 Build 信息..

** BUILD SUCCEEDED **

出現了 SUCCEEDED 顯然已經成功了

使用仿真器啓動 App

xinpureZhu:MyApp xinpure$ cordova emulate ios

此處依然省略大量, 啓動時的編譯信息。啓動成功也會 SUCCEEDED 提示,同時 Xcode 仿真器也會啓動並打開 App

總結

雖然官方已經提供了詳細的說明文檔,文檔也簡單易懂,可是無論多簡單仍是要親自動手敲敲命令,說不定就會出現一些意想不到的問題。

相關文章
相關標籤/搜索