Ionic CLI使用教程指南

Ionic CLI介紹

Ionic CLI是開發Ionic應用程序過程當中使用的主要工具。它就像一個瑞士軍刀:它在一個界面下聚集了大量工具。 CLI包含許多對Ionic開發相當重要的命令,例如startbuildserverun。 它還包含emulateinfo等命令,這些命令在某些狀況下能夠提供一些幫助。css

安裝CLI

要安裝Ionic CLI你須要先安裝nodenpm,而後運行如下命令來安裝最新的Ionic CLI:html

注意:Ionic CLI須要Node 4.X以上的版本支持。node

npm install -g ionic

在 Mac 或 Linux 平臺上,你可能須要添加sudo前綴提權進行全局安裝:android

sudo npm install -g ionic

基本用法

最重要的命令之一是start命令,它負責建立一個新的Ionic項目。 讓咱們試試:ios

ionic start myAwesomeApp --v2

這會建立一個名爲myAwesomeApp的新應用。讓咱們cd到這個目錄而後運行另外一個CLI命令:web

cd myAwesomeApp
ionic info

這應該會輸出你的Ionic環境信息,這對調試很是有用。最後,想要在瀏覽器中預覽你的應用,你須要使用serve命令:apache

ionic serve

如今你已經瞭解了CLI的基礎知識。 若是您喜歡使用命令行,您能夠經過簡單地鍵入ionic來查看命令和選項的完整列表。npm

build

build命令爲特定平臺構建一個應用程序。輸入iosandroid將在platforms/目錄生成平臺特定的代碼。build命令擴展於Cordova的build命令json

命令 描述
ionic build 爲指定的平臺構建Ionic項目
標誌 描述
--nohooks -n 不要爲Cordova添加默認Ionic hooks

emulate

emulate命令用於將應用程序部署到指定的平臺模擬器。 您還能夠經過添加--livereload選項在指定的模擬器上運行實時從新加載。實時重載功能相似於ionic serve,可是編譯的混合應用程序自己正在監視其文件的任何更改,並在須要時從新加載應用程序,而不是使用標準瀏覽器開發和調試應用程序。這減小了不斷重建應用程序以進行小更改的要求。可是,對插件的任何更改仍須要徹底重建。對於實時從新加載工做,開發機和模擬器必須在同一本地網絡,而且設備必須支持web socketsgulp

命令 描述
ionic emulate 在模擬器中運行Ionic項目
標誌 描述
--livereload -l 實時從新加載
--address 指定 Ip 地址
--port -p 指定端口
--livereload-port -r 實時從新加載端口
--consolelogs -c 將應用程序控制臺日志輸出到Ionic CLI(須要livereload)
--serverlogs -s 將開發服務器日誌打印到Ionic CLI(須要livereload)
--debug 調試版模式
--release 發行版模式
--device --emulator --target=FOO 模擬器,設備,目標標識

info

ionic info命令打印出有關係統的Ionic環境和依賴關係的相關信息。這包括諸如你的Ionic,Cordova,Node和Xcode版本。 若是在Github上提交問題,粘貼此命令的輸出能夠幫助其餘人更快地診斷問題。

命令 描述
ionic info 列出有關用戶運行時環境的信息

platform

platform命令爲您的應用程序添加一個新平臺。 運行ionic platform add $platform來添加一個特定的平臺,其中$platform能夠是iosandroid等。

命令 描述
ionic platform 添加用於構建Ionic應用程序的目標平臺
標誌 描述
--noresources -r 不要添加默認的Ionic圖標和啓動屏幕資源
--nosave -e 不要將平臺保存到package.json文件

run

run命令用於將應用程序部署到指定的平臺設備。 您還能夠經過添加--livereload選項在指定的設備上運行實時從新加載。實時重載功能相似於ionic serve,可是編譯的混合應用程序自己正在監視其文件的任何更改,並在須要時從新加載應用程序,而不是使用標準瀏覽器開發和調試應用程序。這減小了不斷重建應用程序以進行小更改的要求。可是,對插件的任何更改仍須要徹底重建。對於實時從新加載工做,開發機和模擬器必須在同一本地網絡,而且設備必須支持web sockets

命令 描述
ionic run 在鏈接的設備中運行Ionic項目
標誌 描述
--livereload -l 實時從新加載
--address 指定 Ip 地址
--port -p 指定端口
--livereload-port -r 實時從新加載端口
--consolelogs -c 將應用程序控制臺日志輸出到Ionic CLI(須要livereload)
--serverlogs -s 將開發服務器日誌打印到Ionic CLI(須要livereload)
--debug 調試版模式
--release 發行版模式
--device --emulator --target=FOO 模擬器,設備,目標標識

serve

使用ionic serve爲應用程序開發和測試啓動本地開發服務器。這對於桌面瀏覽器測試以及在鏈接到同一網絡的設備瀏覽器中測試都頗有用。此外,此命令啓動LiveReload,用於監視文件系統中的更改。 一旦保存文件,瀏覽器將自動刷新。

命令 描述
ionic serve 爲應用開發/測試啓動本地開發服務器
標誌 描述
--consolelogs -c 將應用程序控制臺日志輸出到Ionic CLI
--serverlogs -s 將開發服務器日誌打印到Ionic CLI
--port -p 指定端口
--livereload-port -r 實時從新加載端口
--nobrowser -b 禁用啓動瀏覽器
--nolivereload -d 不要實時從新加載
--noproxy -x 不要添加代理
--address 指定 Ip 地址
--all -a 讓服務器偵聽全部地址(0.0.0.0)
--browser -w 指定啓動的瀏覽器
--browseroption -o 啓動瀏覽器時的參數
--lab -l 在多種屏幕尺寸和平臺類型上測試您的應用
--nogulp 在服務期間禁用gulp
--platform -t 指定平臺類型

start

start命令用於建立一個新的Ionic項目。 使用--v2標誌建立V2項目。 這將默認使用tabs模板,同時下載最新的穩定版本的Ionic。

命令 描述
ionic start 在指定的PATH中啓動一個新的Ionic項目
標誌 描述
--appname -a 應用程序名稱
--id -i 應用程序ID
--no-cordova -w 建立非Cordova需求的基本結構
--sass -s 設置項目以使用Sass CSS預編譯
--list -l 列出可用的啓動器模板
--io-app-id Ionic.io 平臺 ID
--template -t 指定啓動器模版
--zip-file -z 壓縮文件

generate

Ionic如今提供了一個生成器功能來爲您的應用程序建立頁面和服務。 這使得從基本的應用程序到完整功能的應用程序與導航更容易。

這個命令你能夠這樣用:

# ionic g page <PageName>
ionic g page myPage

√ Create app/pages/my-page/my-page.html
√ Create app/pages/my-page/my-page.ts
√ Create app/pages/my-page/my-page.scss

這會同時建立出 htmltsscss。不光能夠建立page還能夠建立provider:

ionic g provider MyData

√ Create app/providers/my-data/my-data.ts

這將使用Angular的http類建立一個帶有簡單http get請求的標準類。

放到最後說由於大愛這個命令,如今建立component或者provider只需回車而後喝口水!

可以建立的成員有:

  • component

  • directive

  • page

  • provider

  • pipe

  • tabs

命令 描述
ionic g 使用Ionic構建器快速建立組件

最後

Ionic CLI大部分命令都是構建於 Cordova CLI 之上的。因此掌握Ionic CLI的同時仍是須要去熟悉Cordova CLI,以便在Ionic CLI撂挑子不幹的時候可以讓Cordova CLI幫你解決問題。

好比此次Ionic 2 RC0 ,ionic build android就撂挑子擺臉色~cordova build android仍然表現穩定。只是須要prebuild一下ionic www。

相關文章
相關標籤/搜索