WebStorm 2021.1 Help

PhoneGap 和 Cordova

PhoneGap和Apache Cordova是用于开发具有单一 HTML、CSS 和 JavaScript/TypeScript 代码库的移动应用程序并针对包括Android在内的各种移动平台的框架。

在你开始前

  1. 确保在Settings/Preferences |上启用了Cordova插件。插件页面，标签Installed。有关详细信息，请参阅管理插件。

  2. 确保您的计算机上有Node.js。

  3. 根据您使用的目标平台和操作系统下载并安装仿真器工具。从Cordova官方网站了解更多信息。

  4. 要模拟iOS平台，请全局安装ios-sim和ios-deploy命令行工具。

    打开嵌入式终端( Alt+F12) 并键入：

    npm install -g ios-sim

    npm install -g ios-deploy

安装 PhoneGap 和 Cordova

在嵌入式终端( Alt+F12) 中，键入以下命令之一：

创建新的 PhoneGap 或 Cordova 应用程序

如果您还没有应用程序，您可以从样板模板生成具有 PhoneGap 或 Cordova 特定结构的 WebStorm 项目。或者，创建一个空的 WebStorm 项目，如创建项目中所述，并在其中配置 PhoneGap 或 Cordova 支持。

从模板创建应用程序

  1. 在欢迎屏幕 上单击创建新项目或选择文件 | 新 | 主菜单中的项目。创建新项目对话框打开。

  2. 在左侧窗格中，选择Cordova。

  3. 在右侧窗格中，指定将存储项目相关文件的文件夹的路径。指定可执行文件的位置。根据您的操作系统和目标平台，这可以是phonegap、phonegap.cmd、cordova或cordova.cmd。

  4. 当您单击Create时，WebStorm 会生成具有特定框架结构的应用程序骨架。

从现有的 PhoneGap 或 Cordova 应用程序开始

要继续开发现有应用程序，请在 WebStorm 中打开它，下载所需的依赖项，并在项目中配置 PhoneGap 或 Cordova 支持。

在项目中配置 PhoneGap 或 Cordova

  1. 打开设置/首选项对话框 ( Ctrl+Alt+S) 并转到语言和框架 | JavaScript | 科尔多瓦。

  2. 如果 WebStorm 没有自动检测到可执行文件，请检查可执行文件的位置或指定路径。这可以是phonegap、phonegap.cmd、cordova 或cordova.cmd，具体取决于您的操作系统和所选框架。

    WebStorm 检测已安装的版本并将其显示在Cordova 版本只读字段中。

  3. 在Cordova 工作目录字段中，指定存储要运行的应用程序文件的文件夹。

  4. 默认情况下，WebStorm 会自动将平台或www目录视为排除在外，并在索引、解析和代码完成期间将其忽略，请参阅在内容根目录中配置文件夹。

    要保留此默认行为，请确保选中自动排除工作目录（'platforms'，'www' for ionic）复选框。

项目安全

当您打开在 WebStorm 外部创建并导入其中的项目时，WebStorm 会显示一个对话框，您可以在其中决定如何使用不熟悉的源代码处理该项目。

不受信任的项目警告

选择以下选项之一：

  • 以安全模式预览：在这种情况下，WebStorm 以“预览模式”打开项目，这意味着您可以浏览项目的源代码，但不能运行任务和脚本或运行/调试项目。

    WebStorm 在编辑器区域顶部显示通知，您可以随时单击Trust project链接并加载您的项目。

  • 信任项目：在这种情况下，WebStorm 打开并加载一个项目。这意味着项目已初始化，项目的插件已解决，依赖项已添加，并且所有 WebStorm 功能都可用。

  • 不要打开：在这种情况下，WebStorm 不会打开项目。

从项目安全中了解更多信息。

运行 PhoneGap 和 Cordova 应用程序

PhoneGap 和 Cordova 应用程序根据专用的运行/调试配置执行。

创建运行配置

  1. 从主菜单中，选择运行 | 编辑配置。在打开的编辑配置对话框中，单击工具栏并从上下文菜单中添加新配置按钮选择Cordova 。

  2. 在打开的运行/调试配置：Cordova对话框中，指定以下内容：

    1. 配置的名称。

    2. 在Cordova 可执行文件字段中，指定可执行文件phonegap、phonegap.cmd、cordova 或cordova.cmd的位置，具体取决于您的操作系统和所选框架。

    3. 在Cordova 工作目录字段中，指定存储要运行的应用程序文件的文件夹。

    4. 从命令列表中，选择要运行的命令。列表的内容，取决于实际使用的框架，即Cordova 可执行字段中指定的可执行文件。可用的选项有：

    5. 从平台列表中，选择应用程序所针对的平台。

      可用的选项有：

      • 安卓

      • iOS要模拟此平台，请全局安装ios-sim和ios-deploy命令行工具。

        打开嵌入式终端( Alt+F12) 并键入：

        npm install -g ios-sim

        npm install -g ios-deploy

      • 浏览器

      • 亚马逊-fireos

      • 火狐

      • 黑莓10

      • ubuntu

      • wp8

      • 视窗

      • 窗户8

      从平台指南了解更多关于目标平台的信息。

    6. 对于Cordova，指定要在其上运行应用程序的目标虚拟或物理 Android 设备：选中指定目标复选框并从列表中选择所需的设备。

      该列表显示当前在您的机器上配置的所有虚拟和物理设备。从Cordova 官方网站了解有关设置模拟器的更多信息。

      如果 WebStorm 显示以下错误消息：Cannot detect ios-sim in path，请确保您已安装ios-sim，请参阅开始之前。

运行应用程序

  • 从主工具栏的列表中选择新创建的运行配置，然后单击运行按钮列表旁边的 。

最后修改：2022 年 1 月 17 日
端点工具窗口 运行/调试配置：Cordova