Cordova Windows 10 UWP 应用程序中出现黑屏问题

Question

我正在使用Cordova构建一个包含Ext.js Web应用程序的UWP Windows 10应用程序。 我可以成功地使用Cordova和Sencha的系统构建应用程序，输出位于cordova\platforms\windows\AppPackages文件夹中的.appx文件，并在信任生成的密钥后安装它。但是，如果在安装完成后勾选“运行完成时运行”复选框，则关闭应用程序并从开始菜单重新打开应用程序时，只会显示黑屏（实际颜色为#1d1f20），卸载再重新安装才能正常工作。 如果将“运行完成时运行”复选框取消选中，然后手动打开应用程序，我也会看到黑屏。当黑屏出现时，按F12打开开发人员工具，然后按Ctrl和R重新加载，就会看到登录屏幕，但没有控制台错误。我尝试添加与闪屏相关的config到config.xml文件，但这并没有帮助解决问题。在Visual Studio中运行本机计算机上的解决方案并可视化构建工具创建app包后，即使在后续启动时，该应用程序也会正常工作，但通过Project > Store > Create App Packages创建的appxbundle文件会出现同样的黑屏问题。我的系统详细信息如下：Windows 10 x64版本1709 OS Build 16299.192，Node: 6.10.3，npm: 5.6.0，cordova: 8.0.0，Visual Studio: Community 2017 15.5.3，JavaScript UWP Project System: 2.0，Visual Studio tools for Universal Windows Apps: 15.0.27130.2020，Ext.js 6.5.1。

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.foo.foomobile" version="1.0.5" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>FooMobile</name>
    <description>
        A sample Apache Cordova application that responds to the deviceready event.
    </description>
    <author email="[e-mail]" href="http://cordova.io">
        Foo Services
    </author>
    <content src="index.html" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
    </platform>
    <plugin name="cordova-plugin-whitelist" spec="1" />
    <preference name="windows-target-version" value="10.0" />
    <preference name="KeepRunning" value="true" />
    <engine name="android" spec="~6.2.3" />
    <engine name="windows" spec="^5.0.0" />
</widget>

任何帮助都将不胜感激。

编辑

我尝试了使用空白的 Ext.js 6.5.3 应用程序进行 Cordova 构建，结果在第一次启动正常工作，但在随后的启动中出现了白屏问题。

编辑2

这里是有关示例应用程序的链接

- Daniel Twigg

---

我在我的设备上无法重现您的问题，您是否尝试在其他设备上安装该软件包？ - Nico Zhu

是的，我们已经在其他Windows 10设备上测试了可安装的.appx文件，同样的问题仍然存在。这实际上也会发生在一个空白的Ext.js应用程序中。这可能是因为我正在使用VS 2017吗？ - Daniel Twigg

你能分享一个简单的样例吗？ - Nico Zhu

这里是Ext.js 6.5.3应用程序的链接：https://ufile.io/vga91。实际的Windows UWP .appx文件位于cordova/platforms/windows/AppPackages中。可以使用从cordova目录下运行的sencha app build native或cordova build windows命令重新构建该文件。 - Daniel Twigg

打开 Cordova 从平台文件夹生成的本地 WP 解决方案，并尝试在物理设备上构建和调试它，查看在 Visual Studio 的调试中发生了什么。 - Frix33

Answer 1

Marc来自Sencha帮助我解决了问题，提供了更新的微加载器。下面的代码显示在要点中。

它使用了一种不同的文件加载方式。

https://gist.github.com/djam90/79389bb82696b082b83da701e12373ef

另一种解决方案是修改 app.json 文件，完全禁用微加载器：

"production": {
    "output": {
        "microloader": {
            "enable": false
         }
     }
}

- Daniel Twigg

Answer 2

我和Daniel Twigg一起解决了这个问题。

问题出在Sencha Ext JS微加载器（bootstrap.js）中。由于某种原因，微加载器完成的页面文件动态加载在Windows上存在问题 - 我有一个修复问题的修改版本的“bootstrap.js”文件 - 如果需要，请联系我，或者我可以在此处发布它。

[e-mail]

- Marc Gusmano