WebStorm 2025.3 Help

PhoneGap 和 Cordova

PhoneGap 和 Apache Cordova 是用于开发移动应用程序的框架，可以使用单个 HTML、CSS 和 JavaScript/TypeScript 代码库并针对各种移动平台，包括 Android。

开始之前

  1. 请确保您的计算机上安装了 Node.js。

  2. 在 设置 | 插件 页面的 Marketplace 选项卡上，按照 从 JetBrains Marketplace 安装插件中描述的步骤安装并启用 Cordova插件。

  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. 当您点击 创建 时，WebStorm 会生成一个具有框架特定结构的应用程序骨架。

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

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

在您的项目中配置 PhoneGap 或 Cordova

  1. 打开 设置 对话框（Ctrl+Alt+S ），然后转到 语言与框架 | JavaScript | Cordova。

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

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

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

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

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

项目安全性

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

不受信任的项目警告

请选择以下选项之一：

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

    WebStorm 会在编辑器区域顶部显示一条通知，您可以点击 信任项目… 链接，随时加载您的项目。

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

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

有关更多信息，请参阅 项目安全。

运行 PhoneGap 和 Cordova 应用程序

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

创建运行配置

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

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

    1. 配置名称。

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

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

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

      • 针对 PhoneGap：

        • emulate

        • 运行

        • prepare

        • serve

        • 远程构建

        • remote run

        有关带有说明的 PhoneGap 特定命令列表，请参阅 PhoneGap CLI。

      • 对于 Cordova：

        • emulate

        • 运行

        • prepare

        • serve

        有关带有说明的 Cordova 特定命令列表，请参阅 Cordova CLI。

    5. 从 平台 列表中选择应用程序的目标平台。

      可用选项有：

      • Android

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

        打开嵌入的 终端 （Alt+F12 ），然后输入：

        npm install -g ios-sim

        npm install -g ios-deploy

      • browser

      • amazon-fireos

      • firefoxos

      • blackberry10

      • ubuntu

      • wp8

      • windows

      • windows8

      在 平台指南 中了解有关目标平台的更多信息。

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

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

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

运行应用程序

  • 从主工具栏的列表中选择新建的运行配置，并点击 “运行”按钮。

最后修改日期： 2025年 12月 8日
OpenAPI运行/调试配置：Cordova