如何开始使用带有 Durandal SPA 应用程序的 Phonegap Build？
Posted
技术标签:
【中文标题】如何开始使用带有 Durandal SPA 应用程序的 Phonegap Build？【英文标题】：How to get started using Phonegap Build with a Durandal SPA App? 【发布时间】：2013-10-21 23:39:15 【问题描述】：我使用 Durandal 构建了一个 SPA，它在浏览器中运行良好。我现在要做的是用Phonegap（最好使用Phonegap Build）将其包装起来，并将其部署为android应用程序。
有关该主题的 Durandal 文档 (http://durandaljs.com/documentation/Native-Apps-With-PhoneGap-Cordova/) 非常少。优化应用程序以生成 main-built.js 文件的关键点已完成，就像将 js/css 资产收集到一个地方一样。
但是，它没有提到 Phonegap/Cordova 有 device ready 事件而不是 document ready 事件。我已经按照说明打包了应用程序。它可以在我的 Android 设备上安装，但卡在启动画面上。其他问题被问到卡在启动屏幕上，但那里发布的解决方案无济于事。我不禁认为这里缺少一些基本的东西？！？
我需要在 index.html 中有 Phonegap 特定的代码吗？在任何javascript中？
注意：我使用的是 Durandal 1.2，但同样的问题也适用于 v2.0。
【问题讨论】：
【参考方案1】：您可以挂钩到 main.js 中的 Phonegap 设备就绪事件，然后您可以确保设备在 shell 或任何视图激活事件被触发之前已经就绪。此示例检查代理，因此它仍会在浏览器中启动。这是来自我的示例 Durandal 2 / Phonegap Build 项目。
https://github.com/BenSinnott/LandmarkTracker
define(['durandal/app', 'durandal/viewLocator', 'durandal/system'], boot);
function boot(app, viewLocator, system)
var useragent = navigator.userAgent.toLowerCase();
if (useragent.match(/android/) || useragent.match(/iphone/) || useragent.match(/ipad/) || useragent.match('ios') || useragent.match('Windows Phone') || useragent.match('iemobile'))
document.addEventListener('deviceready', onDeviceReady, false);
else
onDeviceReady();
function onDeviceReady()
app.title = 'Landmark Tracker';
app.configurePlugins(
router: true
);
app.start().then(function ()
viewLocator.useConvention();
app.setRoot('viewmodels/shell', 'entrance');
);
【讨论】：
谢谢！这正是我正在寻找的那种东西。我对你所做的事情的适应仍然失败，但我还没有机会正确调试，所以看看情况如何。【参考方案2】：但是，它没有提到 Phonegap/Cordova 具有设备就绪事件而不是文档就绪事件。
jQuery 可以通过$(document).ready 监听文档就绪，但 HTML/javascript 本身没有文档就绪事件。最接近的纯 javascript 等效项是侦听 DOMContentLoaded 事件。 Phonegap/Cordova 提供设备就绪事件，如记录的here。请务必在您的<head></head> 标签中包含<script type="text/javascript" charset="utf-8" src="cordova.js"></script>。
它在我的 Android 设备上安装正常，但卡在启动屏幕上。
查看您的 config.xml。你有<preference name="splash-screen-duration" value="xxxx"/> xxxx 设置为某个疯狂的高数字吗？
您始终可以在设备就绪触发后调用navigator.splashscreen.hide()，但您需要构建设备就绪侦听器。使用我上面提供的文档很容易做到。如果这不能解决问题，那么我们将需要查看您的一些代码以深入了解发生了什么。
【讨论】：
【参考方案3】：首先尝试一个未缩小的版本。意味着将所有文件夹复制到您的资产文件夹中。然后看logcat。很可能你有一个js错误。如果可行，请尝试缩小版本并检查该版本是否通过 logcat 引发错误
编辑：请注意，这当然仅适用于 android 中的手动构建，不适用于在线服务。对于 IOS，据我所知，您会在输出窗口中收到错误。
【讨论】：
以上是关于如何开始使用带有 Durandal SPA 应用程序的 Phonegap Build？的主要内容，如果未能解决你的问题，请参考以下文章