时间戳

首页 > 解决方案 > iOS 模拟器显示空白屏幕 - 电容器 - Vue.js

xcode - iOS 模拟器显示空白屏幕 - 电容器 - Vue.js

问题描述

感谢您花时间查看我的帖子。我使用 Capacitor 和 Vue.js 的移动应用程序项目有点卡在这里

长话短说，我已经正确设置了正确的 Vue.js，因为我使用 Node 服务器进行了测试，并且它的功能与我们设置它的方式完全相同。但是当我们使用 Capacitor 插件通过 Xcode 启动我们的 Vue.js 产品时，模拟器显示为空白。它确实显示了电容器启动画面，并且日志提到“在电容器：//本地主机上加载应用程序...”和“已加载 Web 视图”，但什么也没有。我知道我正确安装了电容器，因为我已经重试了多次，而且它也不是火箭科学。我一定是错过了一步。我在下面包含了一个屏幕截图。

终端+模拟器

标签： xcodevue.jscapacitor

解决方案

我有这个问题，也许对你来说也是一样的。直接用于电容器的默认资产是www文件夹。Vue js 构建到该dist文件夹​​。对我来说，我“认为”你正在使用一个使用 Vue CLI 创建的应用程序，但是你在没有将dist目录指定为资产目录的情况下启动了你的项目。将此添加到您的capacitor.config.json

  "webDir": "dist",

然后重新复制资产

npx cap copy

下次使用 vue cli 初始化一个 vue js 项目，npx cap init --web-dir dist用于指向 dist 文件夹。如果这不起作用，请告诉我，以便我可以编辑答案而不是投反对票。

推荐阅读