2016 年 4 月
第 31 卷,第 4 期
本文章是由機器翻譯。
Mobile Apps - 使用 Ionic 與 TACO 建立跨平台 Mobile Apps
由 Adam Tuliper | 2016 年 4 月
有許多工作流程適用於開發及部署跨平台應用程式,這表示它不一定容易選擇。不只可以您卡在何種開發技術的使用,而且整個開發到實際執行工作流程是更令人困惑。您可以需要您是使用 C# 相當熟練,每個行動平台上的原生開發目標的 C/Swift、 Java 及 c + + 有時。或者,您可能選擇像 Apache Cordova 或 Xamarin 的跨平台工具。Beta 版測試是另一個問題,因為您可以側載應用程式 (痛苦超過幾個使用者),使用平台專屬 beta 測試發佈解決方案,例如 Windows 10 裝置在 iOS 上 TestFlight、 Google Play 或 HockeyApp 等平台上的群組上使用促銷代碼。有許多方法來達到類似的最終結果,但透過非常不同的旅程。
在本文中我將會看看的工作流程建立跨平台應用程式包含的安裝工具、 開發、 偵錯、 部署 (生產或測試版) 和更新。此工作流程會利用 Ionic HTML5 行動應用程式架構,適用於 Apache Cordova (TACO) 命令列工具、 CodePush 和 Visual Studio 程式碼的工具,它可以緊密地整合到 Visual Studio。我會著重 Visual Studio 程式碼工作流程和命令列上,它們基本上都是相同的 Mac OS、 Linux 和 Windows 使用相同的工具。您肯定會想針對 Visual Studio 程式碼或 Visual Studio 工具 — 是市面上的最佳的開發及偵錯 Cordova 應用程式,不過我想要強調專案進行 Os (Linux、 Mac OS Windows) 之間完全互通命令行 (Ionic,Cordova 等等) 和工具 (Visual Studio 程式碼或 Visual Studio)。適用於 Visual Studio 工具會自動安裝所有必要的 Sdk,並設定您進行 Windows 原生和 Android 偵錯。
如果您想要進行跨平台應用程式的開發和才接觸 Apache Cordova 的 Web 開發人員,我建議的文件 」 撰寫跨平台混合式應用程式在 Visual Studio 與 Apache Cordova 「 使用者入門 (msdn.com/magazine/dn879349),以取得架構的運作方式的概觀。
Tools for Apache Cordova (TACO)
TACO 是一套設計是為了讓程式開發更快速且更具生產力的產品。開發 Apache Cordova 應用程式時,有多個端點。Visual Studio 路徑會安裝所有必要的 SDK 和協力廠商工具,包括進階 android 模擬器。如果您在處理跨平台開發,請有用的 Visual Studio 程式碼延伸模組會提供您像是 IntelliSense 和偵錯從 Visual Studio 程式碼中的功能。有一組命令列公用程式也稱為 TACO CLI 可讓您安裝協力廠商的 Sdk,如果您偏好的命令列路徑。這些工具會使用任何相容的 Cordova 專案 (Ionic、 PhoneGap 等等)。我要立即安裝 TACO CLI,因此可使用稍後需要它時 ︰
#install taco one time (**this requires Node to be installed **)
npm install taco-cli –g
每當您加入 Apache Cordova 應用程式透過下列命令 (它基本上是一樣的命令列隨您使用) 的任何平台,您只能設定為該平台; 專案此命令不會檢查或安裝所需的 Sdk:
cordova platform add android
#or
ionic platform add android
#or
taco platform add android
Android 平台,例如需要依存項目並未加入 Ionic 或 Cordova 命令列工具,但您可以新增從現有的專案內執行的 Android SDK,Gradle 和 Java 中,例如 ︰
taco install-reqs android
這會安裝 Java 和 Android SDK,以及 Gradle 整合及 Android Debug Bridge (adb) 支援。
開發及偵錯
如果您使用跨平台時,Visual Studio 程式碼有工具,可讓您從模擬器或裝置上的權限進行偵錯中所示 [圖 1。您的上一個資料夾,然後選取来開啟 Visual Studio 程式碼,以滑鼠右鍵按一下,或使用 [檔案 |開啟資料夾。您可以使用任何跨平台 Cordova 應用程式。沒有任何 Visual Studio 特有這個步驟,它可讓您進行工作流程,當您使用與使用其他工具或平台小組很不錯的功能。
[圖 1 從偵錯在 Visual Studio 程式碼
您需要安裝此擴充功能是以帶出命令調色盤,透過控制項-shift-p 和型別 ︰
ext install cordova
偵錯您的應用程式,只要切換回偵錯檢視 (透過圖示或控制項 + Shift + D) 並選擇 [偵錯目標 (例如 [圖 1) 並按一下 [播放]。這是假設您已安裝特定平台 Sdk 以手動方式或透過 taco 安裝它
如果您喜歡 Visual Studio,您也可以使用現有的專案資料夾,例如從命令列工具,只要執行檔案 |新 |從現有程式碼的專案。請注意這只有在您的資料夾加入.jsproj 和 taco.json 檔案 — 這樣就大功告成了。您可以再好消息是使用從 Visual Studio 時您的 Mac OS 和 Linux 開發人員共用相同的儲存機制,並使用 Visual Studio 程式碼、 命令列等等。它也會一起運作。當然,您可以從檔案建立新 Apache Cordova 專案,,|新的專案,而且將能跨平台。它是和諧的世界中,對吧?
IntelliSense 呢? 在 Visual Studio 中您可以從的延伸模組組件庫的權限在 Visual Studio 或從安裝 Ionic Pack bit.ly/1Vq4dIo。您會取得程式碼片段、 驗證及 IntelliSense。Visual Studio 程式碼在安裝 Cordova 工具擴充功能之後,會包含 Ionic 的 IntelliSense。
Ionic 架構
Ionic 是 CSS 架構和 JavaScript UI 文件庫,選擇性地加上建置系統。通常會執行 Apache Cordova,開放原始碼的跨平台 HTML/JS/CSS 原生應用程式架構之上。您通常會聽到 Ionic Cordova 中,搭配使用的但其實沒有必要的;例如,請查看在程式碼畫筆 CodePen.io/ionic;Ionic 會只是 HTML、 CSS、 JavaScript 和影像。
建立有說服力的行動應用程式的挑戰之一,確定它們的外觀和每一個作業系統執行依據的設計指導方針 ︰ 資料設計方針適用於 Android。UX 指導方針適用於通用 Windows 平台 (UWP) 應用程式和 iOS 的人性化介面指導方針。無論您正在開發特定業務應用程式或遊戲,使用者會有期望互動的行為方式。您認為它時,是否有您日常使用整個裝置、 裝置和其他項目在您的生活微互動。
「 喜好 」 社交媒體] 頁面上,或顯示微調行動應用程式中的微互動可以是撥動執行動作,提取到重新整理,以特定方向螢幕一樣簡單。如何處理這些平台特定的方式? Ionic 會自動處理的部分詳細資料。比方說,它會偵測您在 iOS 或 Android 並使用適當的 CSS 樣式微調特定平台的一個,看起來如所示 [圖 2。微調按鈕的 Ionic 標記是自訂的 HTML 標記,如下所示 ︰
<ion-spinner></ion-spinner>
[圖 2 Android 和 iOS 微調按鈕
[圖 3 顯示原生的清單,只使用 HTML 和 CSS Ionic 中的範例程式碼。接著這會產生不錯、 原生應用程式中顯示頂端區段 [圖 4。
原生 Ionic 使用 HTML 中建立之清單的 [圖 3
<div class="list">
<a class="item item-icon-left" href="#">
<i class="icon ion-email"></i>
Check mail
</a>
<a class="item item-icon-left item-icon-right" href="#">
<i class="icon ion-chatbubble-working"></i>
Call Ma
<i class="icon ion-ios-telephone-outline"></i>
</a>
<a class="item item-icon-left" href="#">
<i class="icon ion-mic-a"></i>
Record album
<span class="item-note">
Grammy
</span>
</a>
<a class="item item-icon-left" href="#">
<i class="icon ion-person-stalker"></i>
Friends
<span class="badge badge-assertive">0</span>
</a>
</div>
原生 Ionic 中建立之清單的 [圖 4
快速入門
Ionic 應用程式是只在本機封裝中的 Cordova 應用程式的網頁。您可以看到,以及特定平台 CSS 樣式,則需要有自訂的 HTML 標記。Ionic 應用程式為基礎 Angular。讓我們建立簡單的 Ionic 應用程式,並瀏覽其結構。如果您熟悉 Angular,這將會變得輕而易舉。如果沒有,它是很容易就能了解從較高層級運作。若要使用 Ionic 的命令列介面 (cli),您應該已安裝 npm (可用時安裝從 Nodejs.org) 和從 Git Git-scm.com。
如果您只想要使用 Ionic 的獨立應用程式中,您可以透過 bower 只安裝它 ︰
bower install ionic
Visual Studio 的使用者可以利用 Ionic 範本 (由 Visual Studio team) 的可用工具在 Visual Studio 程式庫中 |擴充功能和更新。因為 Ionic 了自己命令列介面 (CLI),因此很容易使用,它是建置 Cordova 基礎,讓我們探索該路由,並從 Ionic 命令列建立新的應用程式 ︰
#install ionic and cordova (once) and create the app(s)
npm install-g ionic cordova
#create a new app using the tabs template
#Could be one of several templates – run the command:
#ionic templates
#or specify url of a custom template
ionic start myIonic tabs
cd myIonic
#add platform support to the project
ionic platform add android
ionic platform add ios
我沒有安裝,因此我無法在尚未執行的 Android SDK。但簡單安裝透過 TACO CLI,因此我這麼做,然後啟動模擬器。請記住 TACO 提供單單只是 CLI,如先前所述。我也想要註明的 Ionic TACO 和 Cordova 命令列可以一起運作 ︰
#install JAVA, Android SDK, Gradle, and so forth if they don’t yet exist
taco install-reqs android
#run in the browser
ionic serve
#run in an emulator
ionic emulate android
IOS 呢?
若是 iOS,您可以偵錯,並執行使用 Visual Studio 程式碼或 Visual Studio 的 Apache Cordova 應用程式。如果您想要在裝置上或 Apple 模擬器中執行應用程式,因此如果您已經在 Mac OS 上,您可以執行,並將其所示,先前在裝置上或在模擬器中啟動偵錯直接從 Visual Studio 程式碼中,您將需要存取在某個時間點的 Mac。
如果您想要在 Windows 上進行開發,您會有數個選項。如果您使用 Visual Studio,您可以在 Windows 上使用 Apache Ripple 模擬器 (bit.ly/1QOqXxK) 來模擬 iOS 現成的設定 (請參閱 [圖 5)。如果您想要執行和偵錯 (在 OS X) 上的 Apple 模擬器中或在 iOS 裝置,您必須具有安裝 Xcode 的 Mac,而且這樣的 Visual Studio 或 Visual Studio 程式碼的 Mac 上安裝遠端代理程式可以與它通訊,在所述 bit.ly/1XC36H3。您可以取得從 Visual Studio 開發人員的基本功能,在 Mac 上執行 Windows 的三個月 Parallels 訂閱。最後,您可以使用其中一種不同的 Mac 雲端服務,例如 MacInCloud,並執行雲端中所示 bit.ly/1QOrYpz。
[圖 5 iOS Visual Studio 中的執行/偵錯選項
如前所述,您將需要在 Mac 上,安裝 Xcode,但是如果您使用 taco 安裝需求,該命令也會安裝,這可讓您啟動 iOS 模擬器從命令列,並使用 ios-安裝和偵錯至 Xcode 之外的 iOS 裝置上的應用程式部署。
在 Visual Studio 程式碼中載入
此時,我有 Ionic 建立的應用程式資料夾。這是 Cordova 應用程式。我可以載入 Visual Studio 程式碼或 Visual Studio 和指向此資料夾,並開始使用它。我無法現在移至 Visual Studio 程式碼的偵錯] 索引標籤,選擇的目標,並開始偵錯,如所示 [圖 1。
現在讓我們看看應用程式的結構。Index.html 主頁面,並載入 Ionic 和 Angular。您很快會注意到 Ionic 會使用自訂標籤,例如 < middle-瀏覽-檢視 >,但會有更多的短時間內。Index.html 是透過 Angular 傳遞的主機內容的其他部分的根頁面。Ionic 是由兩個參考、 css 和 js,其具有與它包裝在一起的 Angular 所組成 ︰
<!-- compiled css (from sass) output -->
<link href="css/ionic.app.css" rel="stylesheet">
<!-- ionic & angularjs bundled together js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
[圖 6 顯示 index.html body 標記。在此應用程式的流程是 URI 控制。在 app.js 中, 註冊這些 Uri 中所示 [圖 7。如果您是 MVC 開發人員,將這些集合做為您的路由。[圖 7 顯示只區段這裡,稍後會加以擴充。如您所見,這裡處理兩個 Url: /tab 和索引標籤/虛線。取得載入的項目載入應用程式時? $UrlRouterProvider.otherwise 函式提供預設值] 索引標籤/是虛線,因此當您開始 index.html 時,您也可以處理] 索引標籤/虛線。
圖 6 Index.Html Body 標記
<body ng-app="starter">
<!--
The nav bar that will be updated as we navigate between views.
-->
<ion-nav-bar class="bar-stable">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>
<!--
The views will be rendered in the <ion-nav-view> directive below
Templates are in the /templates folder (but you could also
have templates inline in this html file if you'd like).
-->
<ion-nav-view></ion-nav-view>
</body>
[圖 7 App.js 包含角度 UI 路由器
// app.js
// ..
$stateProvider
// Setup an abstract state for the tabs directive
.state('tab', {
url: '/tab',
abstract: true,
templateUrl: 'templates/tabs.html'
})
// Each tab has its own nav history stack:\
.state('tab.dash', {
url: '/dash',
views: {
'tab-dash': {
templateUrl: 'templates/tab-dash.html',
controller: 'DashCtrl'
}
}
})
// Extra code removed for brevity...
// If none of the above states (urls)
// are matched, use this as fallback
$urlRouterProvider.otherwise('/tab/dash');
第一個 URI 是標示為抽象的這表示它將永遠不會直接瀏覽至 /tabs。它將會利用,不過,每當任何其子系的存取。預設值為 /tab/dash,因為這會導致這兩種檢視來處理這些 uri。Cordova 應用程式不在網頁瀏覽器,但網頁檢視中,執行,因此有沒有公開的 URI,使用者會輸入。此功能是完全處理透過 href 或 JavaScript。定義哪些 HTML 中來顯示一個 URI,以及哪些控制器會處理商務邏輯的狀態。
此範本中的./js/controllers.js 檔案包含基本的商務邏輯繫結至每個 URI 範本的組合。$Scope 變數只用於指派的範本可以使用的資料。如果我要傳回的客戶資訊,我可以直接使用 ︰
$scope.customer = { "firstName": "John" };
記住這種,這裡的對談服務的 ChatDetail 控制器指派資料定義在 services.js 中,而在第二個範例中,JSON 物件指派給變數,稱為 「 我可以在我的範本繫結的設定的控制站 ︰
// controller.js
angular.module('starter.controllers', [])
// ...code omitted for brevity
.controller('ChatDetailCtrl', function($scope, $stateParams, Chats) {
$scope.chat = Chats.get($stateParams.chatId);
})
.controller('StorageCtrl', function($scope) {
$scope.settings = {
enableCloudStorage: true
};
});
預設值] 索引標籤介面由兩個範本 — (從 /tab)] 索引標籤介面和準三個子檢視索引標籤-html 中包含,根據使用者的選取。顯示介面的 HTML [圖 8。請注意我如何使用 ionic 索引標籤和 ionic 索引標籤來定義索引標籤控制項和個別索引標籤,然後 middle-導覽-檢視裝載的實際子檢視。
[圖 8 HTML 的預設值] 索引標籤介面
<ion-tabs class="tabs-icon-top tabs-color-active-positive">
<!-- Dashboard Tab -->
<ion-tab title="Status" icon-off="ion-ios-pulse"
icon-on="ion-ios-pulse-strong"
href="#/tab/dash">
<ion-nav-view name="tab-dash"></ion-nav-view>
</ion-tab>
<!-- Chats Tab -->
<ion-tab title="Chats" icon-off="ion-ios-chatboxes-outline"
icon-on="ion-ios-chatboxes"
href="#/tab/chats">
<ion-nav-view name="tab-chats"></ion-nav-view>
</ion-tab>
<!-- Storage Tab -->
<ion-tab title="Storage" icon-off="cloud-outline" icon-on="cloud"
href="#/tab/storage">
<ion-nav-view name="tab-storage"></ion-nav-view>
</ion-tab>
</ion-tabs>
這是預設的索引標籤-虛線檢視應用程式載入時顯示。呈現在索引標籤-虛線 < middle-導覽檢視的 > 先前所述 ︰
<ion-view view-title="Dashboard">
<ion-content class="padding">
<h2>Welcome to Ionic</h2>
<p>
This is the Ionic starter...
</p>
</ion-content>
</ion-view>
Ionic 也了解檢視之間導覽。如果您要在瀏覽器中執行,然後按一下 [上一步,您會移至前一個檢視。如果您在 Windows Phone 或 Android 裝置上執行,並使用 [上一頁] 按鈕,您也將會巡覽至上一個檢視。這被設定 Index.html 內 ︰
<ion-nav-bar class="bar-stable">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>
特定平台 CSS
仍有一些特定平台注意事項執行動作,例如判斷哪一個圖示來顯示,但這個我需要知道我的平台上執行。有數種方法可偵測到此動作。我可以使用 JavaScript 預設 cordova 裝置的外掛程式使用 device.platform,但是這代表被困了一堆 if/else 邏輯來顯示圖示。請記住,這些應用程式由網頁所組成。我不想聽起來簡單,因為 「 只是 Web 頁面 」 可以執行完整的 3D 應用程式 (例如 WebGL) 的原生速度幾乎只在此情況下,因為我使用 HTML/CSS/JS,我可以設定樣式,只要使用 CSS 的應用程式。Ionic 會提供一個稱為 Ionicons,可在程式庫 Ionicons.com。和明確簽出欺騙表在 Ionicons.com/cheatsheet.html。
當您執行 cordova 組建 < 平台 > 所建置的平台時,所發生的一項變更是 < 主體 > 項目以取得該平台額外的 CSS 類別。比方說,如果您在 Android 上執行,body 標記會的一些變數 ︰
<body class="platform-android">
您可以將使用這平台專屬圖示使用顯示的混用 Sass 樣式表語言和 Ionic 圖示。下列命令會使用 Sass 的 Ionic 應用程式 ︰
#tell Ionic to configure/create Sass and make the .scss file
ionic setup sass
如果您使用 Visual Studio,這個步驟中運作,但請務必先設定要編譯至 CSS Sass Gulp 工作執行的工作執行器總管。不確定哪些 Gulp 或工作執行器總管是嗎? 請參閱我在文章上 Grunt 以及 Gulp 在 msdn.com/magazine/mt595751。
如果您要自動編譯程式在 Web 專案中的更少,Sass、 CoffeeScript、 JSX、 ES6 及手寫筆檔的 Visual Studio,您可以使用 Web 編譯器延伸模組來處理它們。在 bit.ly/1O0LP3x。這裡因為我要使用 Gulp,但這兩種方法的運作方式,這並非必要。
現在讓我們開啟./scss/ionic.app.scss 檔案並新增一些 Sass 中。載入有關 Sass,有的資訊,但要注意,就是,它可讓您執行與 CSS 一件事需要相當多的文字來完成。如果我想要顯示特定平台定域機組圖示和預設圖示時沒有一個平台特定,我可以編輯.scss 檔案,加入程式碼所示 [圖 9。
[圖 9 使用 Sass 定義平台特定定域機組圖示
// Handle any platform not defined
.cloud{
@extend .ion-ios-cloud
}
.cloud-outline{
@extend .ion-ios-cloud-outline
}
// Android-specific
.platform-android {
.cloud{
@extend .ion-android-cloud
}
.cloud-outline{
@extend .ion-android-cloud-outline
}
}
// iOS-specific
.platform-ios .platform-win32{
.cloud {
@extend .ion-ios-cloud
}
.cloud-outline{
@extend .ion-ios-cloud-outline
}
}
然後我可以手動觸發此 Gulp 工作並加以執行 ︰
#compile sass
gulp sass
Using gulpfile ~\myIonic\gulpfile.js
[11:28:24] Starting 'sass'...
[11:28:26] Finished 'sass' after 2.1 s
#now run it!
ionic emulate android
您可以立即看到的一件事是平台專屬的索引標籤的位置] 中顯示 圖 10。沒有所需的任何程式碼變更,它是 Ionic 的運作方式。另一項變更,雖然極微小,是在定域機組圖示的差異。簡單的 CSS 修改,因為我要轉譯每個平台的平台特定的圖示。
在 Android 和 iOS 上的 [圖 10 Ionic
提供應用程式更新
應用程式是服務。換句話說,如果您想要確保您的應用程式為中心的狀況良好的社群,您不一次部署,並接著忘了其相關。此外,您應該持續更新提供的修正和功能。Cordova 應用程式選擇完全原生應用程式的令人信服的原因是,您可以從存放區提供更新。IOS 的應用程式核准,比方說,花費數週。如果您有新的 bug 修正或功能需要立即送出您該怎麼辦?
CodePush 是 Microsoft 服務,可讓應用程式的存放區外的更新,只要在 Cordova 應用程式 (通常是從加入新的外掛程式) 沒有原生程式碼的變更。您可以變更資產,例如 HTML/CSS/JavaScript,並建立新的版本。您的應用程式的版本會儲存在 Microsoft Azure,並完全由 CodePush 管理,因此您不必擔心任何基礎結構。讓我們看看我 Android Ionic 應用程式的版本帶到雲端時所需的步驟 ︰
npm install -g code-push-cli
code-push register
code-push app add myIonic
這些命令會提供您一 CodePush 部署金鑰,您可以將 /config.xml 檔案使用 < 平台 > 項目結尾加入 ︰
<widget id="com.ionicframework.myionic594688" version="0.0.1"
xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<!-- other config removed for brevity -->
<platform name="android">
<preference name="CodePushDeploymentKey"
value="YourKeyGeneratedInPriorStep" />
</platform>
<platform name="ios">
<preference name="CodePushDeploymentKey"
value="YourKeyGeneratedInPriorStep" />
</platform>
</widget>
現在您只需要告訴 CodePush 更新檢查並同步處理變更。如果找不到變更,它們是下載,且在下次啟動應用程式的更新。非同步和同步的方式有檢查,不過我會保持它簡短悅耳這裡與同步處理。在 app.js,沒有 Cordova Api 準備好時,檢查有我的應用程式的更新的好地方。一般而言,Cordova 應用程式在您知道您準備好要藉由連結到 deviceready:
window.addEventListener('deviceready', {})
因為我使用 Ionic,它會接聽 deviceready 事件,再呼叫 $ionicPlatform.ready,app.js 在範本中所提供。我只需要加入一行程式那里的碼 CodePush 同步處理 ︰
// app.js
angular.module('starter', ['ionic', 'starter.controllers', 'starter.services'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
window.codePush.sync();
// ...
});
})
我對小型的 HTML 更新 /templates/tab-dash 檔案。若要釋放這項變更,我直接詢問 Cordova 以準備,然後再 CodePush 它。首先我必須 /config.xml 所述的應用程式的版本 ︰
<widget id= "com.ionicframework.myiconic594688" version= "0.0.1"
接下來,我準備,並將這項變更發送至 CodePush 服務 whopping 兩個步驟 ︰
#get my app ready (makes changes only in the /platforms folders)
#we could also cordova prepare or taco prepare – all do the same thing
ionic prepare
#push this release up to the cloud
#we use /assets as those are the prepared html/js/css files
code-push release myIonic ./platforms/android/assets/www 0.0.1 --deploymentName Production
現在,應用程式啟動時從 Visual Studio 程式碼,我可以看到檢查更新,在 Visual Studio 程式碼進行偵錯主控台應用程式 ︰
Debug Console
Launching for android (This may take a while)...
App successfully launched
Attaching to android
Forwarding debug port
Attaching to app.
[CodePush] An update is available.
[CodePush] Downloading update package ...
[CodePush] Package download
[CodePush] Installing update package ...
[CodePush] First update: back up package information skipped.
[CodePush] Install succeeded.
就這麼簡單 ! 在此組態中,需要兩個啟動的應用程式,以了解所做的變更。第一個會在啟動時,偵測到 CodePush 的新組建時,下載更新第二次應用程式會啟動在套用更新。請注意這整個工作流程可用於生產或測試。我所討論的運作正常模擬器中,以及 live 的所有內容,我可以看到我 Android 模擬器中的結果。
總結
我所討論的工作流程包括開發、 準備將您的應用程式發送至 CodePush 服務。如果您持續部署 aficionado,是在所述的完整工作流程 bit.ly/1QpydG4。此工作流程此外概要說明從 Visual Studio Team System 和使用 HockeyApp 管理 beta 版的散發套件的部署 (當機報告和使用者意見反應,過 !)。如果您希望,馬上,Subhag 橡樹有很有幫助的獨立的研討會,您可以在找到 bit.ly/1QpCwBt。
Angular 和 Ionic 有新的主要版本中都可立即簽出,運作 (2.x 每個訊息)。這是有點早期來談這些這裡因為在撰寫本文時,在沒有已發行。
現在這只是其中一項最令人興奮的區域的行動裝置應用程式開發人員快速導覽。請查看一些很棒的文件,並掌握未來變更的下列資源 ︰
- TACO- taco.tools
- Visual Studio Tools for Apache Cordova- taco.visualstudio.com
- 效能秘訣- bit.ly/24kEaIx
- 原生轉換 Ionic 架構- bit.ly/1SKFFfm
- Visual Studio Tools for Apache Cordova 小組部落格- bit.ly/1KBpJcH
下回見 !
Adam Tuliper是活在陽光普照 SoCal Microsoft 的資深技術推廣者。他是 Web 開發人員/遊戲開發人員 Pluralsight.com 作者與全能的技術。找到他的 Twitter: @AdamTuliper 或 channel9.msdn.com/Blogs/AdamsGarage。
感謝以下的微軟技術專家對本文的審閱: Subhag Oak,Ricardo Minguez Pablos 和 Ryan Salva