共用方式為

安裝 Visual Studio Tools for Apache Cordova

  • 發行項

本主題適用於發行前版本軟體 -- Apache Cordova 的 Visual Studio Tools。這些功能描述於預覽中，但有可能變更。您可以從 Microsoft 下載中心下載此 Preview。

本文說明如何安裝必要的工具和協力廠商相依項目，以使用 Visual Studio Tools for Apache Cordova 建立跨平台的 Cordova 應用程式：

需求
取得工具
安裝工具
手動安裝相依性
安裝 iOS 工具
覆寫系統環境變數

需求

  • 下列其中一個作業系統：Windows 7、Windows 8、Windows 8.1 或 Windows Server 2012 R2。

    重要

    如果您使用 Windows 7，可以開發 Android 和 iOS 的應用程式，但無法開發 Windows 或 Windows Phone 的應用程式。

  • Visual Studio 2013 Update 4 (Professional、Ultimate 或 Premium) 已安裝下列功能：

    • 維護 Windows 8 市集應用程式的工具

    • Windows Phone 8.0 SDK

      您可以將這些功能加入至 Visual Studio 2013 Update 4 的現有安裝。 在 [控制台] 中，選擇 [程式和功能]。 從清單中選取 [Visual Studio 2013]，然後選擇 [變更]。 在 Visual Studio 安裝程式視窗中，選擇 [修改]。 在功能清單中，如圖所示選取兩個選項。

      安裝 Visual Studio 的選擇性功能

  • 如果您使用的是 Visual Studio 2015 Preview 而非 Visual Studio 2013，請參閱本主題的安裝程序。

若要建置特定裝置平台的應用程式，有幾個額外的需求：

取得工具

若要取得 Visual Studio Tools for Apache Cordova 擴充功能，請移至 Microsoft 下載中心。 請遵循下一節中的步驟安裝擴充功能。

重要

如果您之前已安裝過 Visual Studio Tools for Apache Cordova (多重裝置混合式應用程式) 的 CTP，就必須先使用 [控制台] 與 [程式和功能] 解除安裝 CTP，接著再安裝 Visual Studio 2013 Update 4 和最新的 CTP。

在 Visual Studio 2015 Preview 中，您可於安裝期間將 Visual Studio Tools for Apache Cordova 安裝為選擇性功能。 如需了解安裝程序，請參閱開始使用 Visual Studio Tools for Apache Cordova。

安裝工具

安裝程式會先安裝 Visual Studio 的修補程式，以支援 Cordova 應用程式開發。 然後會提供安裝下列協力廠商軟體的選項。 大多數軟體是特定平台或 Apache Cordova 所需的開放原始碼軟體。

  • Joyent Node.js 可讓 Visual Studio 與 Apache Cordova 命令列介面 (CLI) 和 Apache Ripple 模擬器進行整合。

  • 只有在必須手動加入特定 Cordova 外掛程式的 Git URI 時，才需要 Git CLI。

  • iOS 和 Android 需要 Google Chrome，才能執行 Apache Ripple 模擬器。

  • Android 建置流程需要 Apache Ant 1.8.0 (含) 以上版本。

  • Android 建置流程需要 Oracle Java JDK 7。

  • Android 建置流程和 Ripple 需要 Android SDK。

  • 需要 Windows 執行階段的 SQLite，才能將 SQL 連線加入至 Windows 應用程式 (適用於 WebSQL Polyfill 外掛程式)。

  • 需要 Apple iTunes，才能將應用程式部署至與 Windows PC 連線的 iOS 裝置。

安裝 Visual Studio 擴充功能和相依項目

  1. 執行您在取得工具中找到的安裝程式。

  2. 遵循下列指示安裝 Visual Studio 擴充功能。

  3. 出現提示時，允許安裝程式安裝協力廠商軟體相依項目；您也可以清除選取的軟體，並在稍後手動安裝所需的相依項目。

    重要

    如果您的系統上已安裝協力廠商相依項目，或者您選擇手動安裝相依項目，您可能必須更新系統路徑。請參閱手動安裝相依性。

    選取要安裝的協力廠商軟體

  4. 重新啟動電腦。

    重要

    您必須重新開機，確定一切都已正確安裝。

  5. 開啟 Visual Studio，然後依序選擇 [工具]、[擴充功能和更新] 及 [更新]。 若有 Visual Studio Tools for Apache Cordova 適用的 Visual Studio 更新，則請安裝它。

    注意事項注意事項

    當您在安裝工具之後第一次建置應用程式時，Visual Studio 會下載及安裝 Cordova 工具。因此，第一個組建需要額外的時間才能完成。請檢查 [輸出] 視窗，以查看進度。

  6. 您必須在 Mac 電腦上安裝遠端代理程式，才能在 iOS 模擬器或 iOS 裝置上執行應用程式。 請參閱 安裝工具以建置 iOS。

手動安裝相依項目

如果您選擇不安裝一或多個具有擴充功能的相依項目，您可以稍後再手動進行安裝。

警告

您可以依任何順序安裝相依項目，除了 Java 之外。您必須先安裝及設定 Java，再安裝 Android SDK。

請閱讀下列資訊並使用這些連結，以手動安裝相依項目。

  • Joyent Node.js

    建議安裝 x86 版本的 Node.js。

  • Google Chrome

  • Git 命令列工具

    當您安裝 Git 命令列工具時，請選取將 Git 加入至命令提示字元路徑的選項。

    警告

    預設會安裝 Git 命令列工具 1.9.3。若您安裝比 1.9.0 舊的版本，則可能會發生未預期的失敗。

  • Apache Ant

    • 下載 Ant 並解壓縮至 C:/ant-1.x.x 等位置

    • 設定 ANT_HOME 環境變數，以指向上述位置。

    • 將 %ANT_HOME%\bin 加入系統路徑。

      注意事項注意事項

      如果您需要手動設定這個環境變數，請參閱覆寫系統環境變數。

  • Oracle Java 7

    • 將 JAVA_HOME 環境變數設定為 C:/Program Files/Java/jdk1.7.0_55

    • 將這個工具加入至系統路徑：%JAVA_HOME%\bin

      注意事項注意事項

      如果您需要手動設定這個環境變數，請參閱覆寫系統環境變數。

  • Android SDK 含下列 SDK 封裝：

    • Android SDK 工具 (最新版)

    • Android SDK 平台工具 (最新版)

    • Android SDK 建置工具 (最新版)

    • Android 4.4.x (API level 19) 含下列封裝：

      • SDK 平台

      • ARM EABI v7a 系統映像

      • Intel x86 Atom 系統映像

      • Google API (x86 系統映像)

      • Google API (ARM 系統映像)

    下圖顯示 Android SDK Manager 中的必要封裝。

    Android SDK 的必要套件

    將 ADT_HOME 環境變數設定為 SDK 安裝位置。

    將這個工具加入至系統路徑：%ADT_HOME%\tools;%ADT_HOME%\platform-tools

    如果您需要手動設定這個環境變數，請參閱覆寫系統環境變數。

    提示

    若您將 Android SDK 安裝至 Windows 上的預設位置，則該位置會是 C:\Program Files (x86)\Android\android-sdk。

  • Apple iTunes (x86、x64)

  • SQLite

  • WebSocket4Net (如果正在 Windows 7 上開發應用程式，則為必要項)

    1. 從 CodePlex 下載 WebSocket4Net(0.9).Binaries.zip。

    2. 從下載的 zip 檔中，將 net45\Release\WebSocket4Net.dll 複製到電腦上的 %ProgramFiles(x86)%\Microsoft Visual Studio 12.0\Common7\IDE\CommonExtensions\Microsoft\WebClient\Diagnostics\ToolWindows 資料夾中。

安裝 iOS 工具

從 Visual Studio 建置及執行 iOS 應用程式需要一些額外步驟。 請參閱 安裝工具以建置 iOS。

覆寫系統環境變數

Visual Studio 偵測到您已安裝之協力廠商軟體的組態，並保留下列環境變數中的安裝路徑：

  • ADT_HOME 指向 Android 安裝路徑。

  • ANT_HOME 指向電腦上的 Ant 資料夾。

  • GIT_HOME 指向 Git 安裝路徑。

  • JAVA_HOME 指向 Java 安裝路徑。

建置及執行您的應用程式時，Visual Studio 會使用這些環境變數。 您可以檢視環境變數，並透過 Visual Studio 的 [選項] 對話方塊修訂其值。 您可能基於下列其中一個原因而需要覆寫預設值：

  • Visual Studio 無法確認路徑。 在此情況下，環境變數旁會顯示一則警告。

  • 您已安裝多個軟體版本，並想使用特定版本。

  • 您希望全域環境路徑與本機 Visual Studio 環境不同。

覆寫變數

  1. 在 Visual Studio 功能表列上，選擇 [工具]、[選項]。

  2. 在 [選項] 對話方塊中，選擇 [Tools for Apache Cordova]，然後選擇 [環境變數覆寫]。

  3. 進行變更：

    • 若要覆寫值，請選取其核取方塊，然後修訂值。

      如果路徑資訊無效或遺漏，Visual Studio 會在該變數旁顯示一則警告。

    • 若要將環境變數重設為其預設值，請清除其核取方塊，或選擇 [重設為預設值]。

  4. 選擇 [確定] 儲存變更並關閉對話方塊。

環境變數，警告訊息

手動更新 Cordova 版本

Visual Studio 已針對特定 Apache Cordova 版本進行測試。 我們希望能支援選取每個專案的 Cordova 版本，但目前仍可套用修補程式以在您系統的所有專案中使用不同版本的 Cordova。

警告

未正式支援 Visual Studio 的修補。您可能會遇到非預期的行為，因此僅建議進階使用者採取這些步驟。修補程式會造成涵蓋整個電腦系統的變更。

將 Visual Studio 更新為使用不同版本的 Cordova

  1. 安裝 Visual Studio Tools for Cordova 之後，請建立一個空白專案以安裝 Cordova。

  2. 開啟命令列並輸入下列命令：

    cd %appdata%\npm\node_modules\vs-mda\

    如果您是自行安裝 Node.js，則 vs-mda 可能會安裝在不同的位置。 上述命令顯示預設的安裝位置。

  3. 在命令列上，輸入下列命令：

    npm install cordova@version --save

    其中，version 是指您要使用的 Cordova CLI 版本。 例如，您可能使用 4.1.0。

    如果您已在某位置安裝過 Cordova，即可輸入 cordova --version 找出 Cordova 的版本。

    重要

    執行上述的安裝命令時，請務必省略 -g 全域參數。

  4. 在所編輯的 Visual Studio 專案上，執行「清除」作業 (例如 [清除方案])，版本變更才會生效。

還原為支援的 Cordova 版本

  • 開啟命令提示字元，並輸入：

    npm uninstall -g vs-mda

    Visual Studio 會在您下次建置時自動重新安裝 vs-mda。

    或者，您可以在 C:\Program Files (x86)\Microsoft Visual Studio 12.0\Common7\IDE\Extensions 下方搜尋 vs-mda，並將 package.json 修改為您要參照使用的版本。 修改好 package.json 之後，請從相同資料夾中執行下列命令：

    npm install -g vs-mda

為確保 Mac 支援 iOS 建置，vs-mda-remote 使用的 Cordova 版本必須符合您為 Visual Studio 所安裝的版本。 下列步驟說明如何將 vs-mda-remote 更新為使用特定版本的 Cordova。 如需安裝 iOS 建置工具的完整資訊，請參閱安裝工具以建置 iOS。

將 Mac 上的 vs-mda-remote 更新為不同版本的 Cordova

  1. 開啟 Mac 上的 Terminal 應用程式，並輸入下列命令：

    cd /usr/local/lib/node_modules/vs-mda-remote

    如果您沒有全域安裝 (-g) vs-mda-remote，您 Mac 上的 vs-mda-remote 位置可能會不同。

  2. 輸入下列命令：

    sudo npm install cordova@version --save

    其中，version 是您之前安裝的 Cordova CLI 版本。 例如，這可能是 4.1.0。

    重要

    執行上述的安裝命令時，請務必省略 -g 全域參數。

    如果您已在某位置安裝 Cordova，可輸入 cordova --version 以找出 Cordova 的版本。

    在所編輯的 Visual Studio 專案上，執行「清除」作業 (例如 [清除方案])，版本變更才會生效。

將 Mac 上的 vs-mda-remote 還原為支援的版本

  1. 開啟 Mac 上的 Terminal 應用程式，並輸入：

    sudo npm uninstall -g vs-mda-remote

  2. 輸入下列命令：

    sudo npm install -g vs-mda-remote --save

    

請參閱

概念

安裝工具以建置 iOS

其他資源

下載工具

常見問題集

已知問題