在IntelliJ IDEA使用之PhoneGap/Cordova

PhoneGap/Cordova

此功能僅在Ultimate版本中受支持。

在IntelliJ IDEA中，您可以使用PhoneGap，Apache Cordova和Ionic框架開發(fā)旨在運(yùn)行在各種移動平臺（包括Android）上的應(yīng)用程序。 

在你開始使用PhoneGap，Apache Cordova和Ionic之前，你需要：

1. 如“插件管理”中所述， 在“插件”頁面上安裝并啟用PhoneGap/Cordova存儲庫插件 。
2. 安裝Node.js。
3. 根據(jù)目標(biāo)平臺和您使用的操作系統(tǒng)，下載并安裝模擬器工具；您可以從Cordova官方網(wǎng)站了解更多信息。

安裝PhoneGap/Cordova/Ionic

• 打開內(nèi)置的IntelliJ IDEA終端（Alt+F12）并在命令提示符下鍵入以下命令之一：

  npm install -- global phonegap
  npm install -- global cordova
  npm install -- global ionic

創(chuàng)建一個新的PhoneGap/Cordova/Ionic應(yīng)用程序

如果您還沒有應(yīng)用程序，可以從樣板模板生成具有PhoneGap/Cordova/Ionic特定結(jié)構(gòu)的IntelliJ IDEA項(xiàng)目?；蛘撸瑒?chuàng)建一個空的IntelliJ IDEA項(xiàng)目，并在其中配置PhoneGap/Cordova/Ionic支持，如下面的“開始使用現(xiàn)有的PhoneGap/Cordova/Ionic應(yīng)用程序”所述。

從模板創(chuàng)建PhoneGap/Cordova/Ionic應(yīng)用程序：

1. 在主菜單上選擇：文件|新建|項(xiàng)目，或單擊歡迎屏幕上的單擊“新建項(xiàng)目”按鈕。
2. 在“項(xiàng)目類別和選項(xiàng)”對話框（“新建項(xiàng)目”向?qū)У牡谝豁摚┲校谧髠?cè)窗格中選擇“靜態(tài)Web”。
3. 在右側(cè)窗格中，選擇：PhoneGap/Cordova App，然后單擊“下一步”。
4. 在向?qū)У牡诙撋?，指定?xiàng)目名稱和要在其中創(chuàng)建的文件夾。指定可執(zhí)行文件的位置：phonegap.cmd，cordova.cmd，或ionic.cmd （請參閱上文的“安裝PhoneGap/Cordova/Ionic”）。
5. 單擊“完成”后，IntelliJ IDEA將生成具有特定于框架結(jié)構(gòu)的PhoneGap/Cordova/Ionic應(yīng)用程序的框架。

創(chuàng)建一個空的IntelliJ IDEA項(xiàng)目：

1. 在主菜單上選擇：文件|新建|項(xiàng)目，或單擊歡迎屏幕上的“新建項(xiàng)目”按鈕。
2. 在“項(xiàng)目類別和選項(xiàng)”對話框（“新建項(xiàng)目”向?qū)У牡谝豁摚┲?，在左?cè)窗格中選擇“靜態(tài)Web”。
3. 在右側(cè)窗格中，再次選擇“靜態(tài)Web”，然后單擊“下一步”。
4. 在向?qū)У牡诙撋?，指定?xiàng)目文件夾和名稱，然后單擊“完成”。

開始使用現(xiàn)有的PhoneGap/Cordova/Ionic應(yīng)用程序

1. 通過在主菜單上選擇：文件|打開，來在IntelliJ IDEA中打開所需的PhoneGap/Cordova/Ionic應(yīng)用程序，或或單擊歡迎屏幕上的“打開”。
2. 在“設(shè)置/首選項(xiàng)”對話框（Ctrl+Alt+S）中，單擊“語言和框架”下的“JavaScript” ，然后單擊“Cordova”，將打開Cordova頁面。
3. 檢查可執(zhí)行文件的位置：phonegap.cmd，cordova.cmd，或者ionic.cmd，如果IntelliJ IDEA未自動檢測到可執(zhí)行文件，則指定其路徑。

   IntelliJ IDEA檢測已安裝的版本并將其顯示在PhoneGap/Cordova版本的只讀字段中。

4. 在Cordova工作目錄字段中，指定存儲要運(yùn)行的PhoneGap/Cordova/Ionic應(yīng)用程序文件的文件夾。
5. 在“插件”區(qū)域中，通過安裝所需的軟件包來配置要在開發(fā)中使用的插件列表。該列表顯示了您的計(jì)算機(jī)上當(dāng)前安裝的所有PhoneGap/Cordova/Ionic插件，包括全局和項(xiàng)目級別。
   • 要安裝插件，請單擊“安裝”按鈕。在打開的“可用包”對話框中，選擇所需的包。

     要全局安裝軟件包，請選中“選項(xiàng)”復(fù)選框，然后在文本框中輸入：--global。單擊“安裝包”。

   • 要刪除插件，請?jiān)诹斜碇羞x擇它，然后單擊“卸載”按鈕。
   • 要將插件升級到最新的可用版本，請?jiān)诹斜碇羞x擇插件，然后單擊“升級”按鈕。

創(chuàng)建并啟動PhoneGap/Cordova/Ionic運(yùn)行配置

PhoneGap/Cordova/Ionic應(yīng)用程序根據(jù)專用的運(yùn)行/調(diào)試配置執(zhí)行。

1. 在主菜單上，選擇：運(yùn)行|編輯配置，在打開的“編輯配置”對話框中，單擊“添加新配置”工具欄按鈕，然后在上下文菜單中選擇“PhoneGap/Cordova”。
2. 在打開的“運(yùn)行/調(diào)試配置：PhoneGap / Cordova”對話框中，指定以下內(nèi)容：
   1. 配置的名稱。
   2. 在PhoneGap/Cordova可執(zhí)行文件路徑字段中，指定可執(zhí)行文件的位置：phonegap.cmd，cordova.cmd或ionic.cml。
   3. 在PhoneGap/Cordova工作目錄字段中，指定存儲要運(yùn)行的PhoneGap/Cordova/Ionic應(yīng)用程序文件的文件夾。
   4. 從“命令”下拉列表中，選擇要運(yùn)行的命令。下拉列表的內(nèi)容取決于實(shí)際使用的框架，即PhoneGap/Cordova可執(zhí)行路徑字段中指定的可執(zhí)行文件?？捎眠x項(xiàng)包括：
      • 對于PhoneGap：
        • 模仿
        • 運(yùn)行
        • 準(zhǔn)備
        • 服務(wù)
        • 遠(yuǎn)程構(gòu)建
        • 遠(yuǎn)程運(yùn)行
      • 對于Cordova：
        
        • 模仿
        • 運(yùn)行
        • 準(zhǔn)備
        • 服務(wù)
      • 對于Ionic：
        • 模仿
        • 運(yùn)行
        • 準(zhǔn)備
        • 服務(wù)
   5. 從“平臺”下拉列表中，選擇應(yīng)用程序所針對的平臺。可用選項(xiàng)包括：
      • Android
      • ios：要模擬此平臺，您需要全局安裝ios-sim命令行工具。您可以通過節(jié)點(diǎn)包管理器（npm），或者運(yùn)行sudo npm install ios-sim -g命令，具體取決于您的操作系統(tǒng)。
      • amazon-fireos
      • firefoxos
      • blackberry10
      • Ubuntu
      • WP8
      • windows8
      • 瀏覽器
   6. 對于Cordova和Ionic，請指定要在其上運(yùn)行應(yīng)用程序的目標(biāo)虛擬或物理Android設(shè)備：選擇“指定目標(biāo)”復(fù)選框，然后從下拉列表中選擇所需設(shè)備。該列表顯示了我們計(jì)算機(jī)上當(dāng)前配置的所有虛擬和物理設(shè)備。

      如果IntelliJ IDEA顯示以下錯誤消息：無法檢測路徑中的ios-simios-sim，請確保已安裝，確保在開始本節(jié)內(nèi)容之前，你已經(jīng)做了正確的配置。

3. 要運(yùn)行PhoneGap/Cordova/Ionic應(yīng)用程序，請從主工具欄的列表中選擇所需的運(yùn)行配置，然后在主菜單上選擇：運(yùn)行|運(yùn)行<配置名稱>，或單擊“運(yùn)行” 。