搜索文档 /

调试

现场重新加载

实时重新加载对于设备硬件上的本地功能(例如插件)非常有用。当检测到应用程序中的更改时,它并没有每次更改代码时部署新的本机二进制文件,而是重新加载浏览器(或WebView)。 在这里了解更多

iOS和野生动物园

Safari可用于在连接的iOS设备或iOS模拟器上调试离子应betway东盟体育app用程序。

首先,在iOS设备上,启用 网络检查员 从设置> Safari>高级。

接下来,在Mac上打开Safari,然后启用 在菜单栏中显示开发菜单 在Safari>“首选”下>高级。

运行iOS模拟器或将iOS设备连接到Mac,然后运行要调试的离子应用程序。betway东盟体育app

在野生动物园中,选择 发展 在工具栏中。在下拉菜单选项中,您应该看到设备和应用程序的名称。悬停在应用程序名称上,然后单击 Localhost 。这将使用Safari开发人员工具打开一个新窗口 - 使用它们检查和调试设备上运行的离子应用程序。betway东盟体育app

Android和Chrome

使用Google Chrome的DevTools在浏览器中使用该应用程序在浏览器中运行时调试 betway东盟体育app离子发球 命令,部署到模拟器或物理设备上。

要检查物理设备,首先您需要启用开发人员模式。将您的Android设备连接到计算机,然后转到 设置>关于 滚动到 构建编号 并点击7次。这将激活一个新选项 设置 菜单叫 开发人员选项

接下来,去 设置>开发人员选项 并确保打开开发人员选项开关。向下滚动 USB调试 并确保还启用了它。默认情况下,Android模拟器中启用了开发人员选项和USB调试。

打开Chrome浏览器并导航到URL Chrome:// Inspect/#设备 。您连接的Android设备应显示在远程目标列表中。

在设备上,打开您想使用Chrome调试的离子应用程betway东盟体育app序。

在设备上运行您的应用程序,请回到Chrome并单击 检查 在远程目标列表中的设备下方。这将在新窗口中打开Chrome开发人员工具。然后,您将能够使用所有Chrome DevTools在设备上运行的应用程序进行调试。

由于次要错误,当您打开Chrome Developer工具时,应用程序预览可能不会自动出现。要使它出现,请单击 元素 选项卡然后单击任何DOM元素,然后在任何CSS规则上切换,并且将显示App Preview窗口。

在Chrome(Android和iOS)中与Visual Studio进行调试

Visual Studio代码 也可以用于调试在Chrome Web浏览器中运行的离子应用betway东盟体育app程序。

为此,请在浏览器中运行您的应用程序 betway东盟体育app离子发球 。记下您的应用程序正在运行的端口。接下来,使用Visual Stubetway东盟体育appdio代码打开您的离子项目。

在VS代码中的左垂直菜单中,单击 图标。如果您是在项目中首次配置此内容,请单击该选项以创建一个 启动 文件。选择 铬合金 从环境选项下拉列表。这将自动生成一个 启动 带有用于针对Localhost启动Chrome的配置的文件。

确保您的URL属性中使用的端口 启动 文件匹配您在运行时观察到的端口 betway东盟体育app离子发球 。使用不正确的端口号将无效。

在“调试目标下拉菜单”中,选择 针对Chrome发射 ,然后单击“运行”。这将打开Chrome浏览器和VS代码的新实例。您可以设置断点,并在应用程序以Chrome运行时使用VS代码中的其他调试工具。

在Android中使用Visual Studio代码进行调试

Visual Studio代码 有一个专用插件,用于在Android WebView中运行的调试应用程序。

插件 在设备和Visual Studio代码开发人员工具之间创建桥梁,并允许从编辑器直接调试。

为了使用此插件来调试您的离子应用程序,请先安装它,然后在Android模拟器中启动您betway东盟体育app的应用程序,或连接Android设备并运行应用程序。您可能需要在Android设备上启用USB调试。

在您的离子项目的根部中,创建一个名为的文betway东盟体育app件夹 .vscode 在该文件夹中创建一个名为的文件 启动 。里面 启动 ,输入以下代码以将插件配置为调试离子应用程序:betway东盟体育app


             {“版本”:“ 0.2.0”,“ configurations”:[{“ type”:“ android-webview”,“ request”:“ contect”:“ contact”,“ name”:“附加到Android WebView”,“ WebRoot”:“ $ {workspacefolder}/www”,“ sourcemaps”:true,“ sourcemappathoverrides”:{“ webpack:/*”:“ $ {workspacefolder}/*}}}}}
复制 复制

接下来,启动调试过程,选择设备和离子应用程序。betway东盟体育appVS代码将连接到Android设备和离子应用程序,您现在可以调试应用程序,其中包括设置断点。betway东盟体育app

如果您无法设置断点并获得错误说明, “突破点被忽略了,因为找不到生成的代码(源地图问题?)” 这意味着转移的JavaScript文件的路径不正确。使用 .scripts 在调试控制台中命令查看已加载脚本。通过尝试在 Sourcemappathoverrides 钥匙 启动 配置文件。

下一个
构建错误
Baidu