Apache Cordova 关于 VS 输出问题答案

【问题标题】：Apache Cordova on VS output problemsApache Cordova 关于 VS 输出问题
【发布时间】：2015-12-31 15:46:42
【问题描述】：

您好，我是 Apache Cordova 的新手。我最近开发了一个在 chrome 和设备上运行良好的 web 应用程序，但是当我得到 Visual Studio Apache Cordova (visual studio 2015) 输出时，一些 CSS 文件似乎没有完全加载，我的意思是 CSS 的某些部分不能正常工作.第二个问题是nexus 5上不同设备的输出不同，它是90％可以，但在LG L70或bluestacks中，低于30％是可以的。有人知道原因和解决方法吗？谢谢

【问题讨论】：

什么是VS？您肯定不是指 Visual Studio。
是的 Visual Studio 2015（我编辑了问题）......你为什么问？
啊，现在我明白了。在编辑之前无法抓取它。
@hsbr13 您的问题似乎有很多问题，并且没有足够的详细信息。最初这似乎是一个HTML+ CSS + JavaScript 问题。获得真正可靠的解决方案的最佳方法是在 GitHub 上创建一个存储库。在 VS2015 + Cordova 中调试设备的最佳实践：使用 Ripple（调试 > Android > Ripple - XXXX）和 JavaScript 控制台查看 JavaScript 错误。使用 Tools > Visual Studio Emulator for Android 在输出窗口中调试和查看 JavaScript 错误。

标签： android cordova visual-studio-cordova

【解决方案1】：

好吧，没有任何代码很难说（而且您的问题非常广泛！）。我也不得不咬紧牙关，以免（再次）对科尔多瓦大发雷霆。

但是根据我（幸运地）对 Cordova 的糟糕体验，您确实可以处理不同的 WebView 及其不同的实现。我建议您获取设备的 Android WebView 版本并牢记这一点来测试您的应用程序。愿您发现“3.2.1 以下的 WebView 版本中的一切都出错”之类的相似之处，并根据您的发现相应地修改您的应用程序。

【讨论】：

它不是我项目的一小部分，我可以向您展示它有很多问题。我已经在各种尺寸的chrome（检查元素）上对其进行了测试，它很好，并通过mozilla在不同的小工具上再次打开它一切都很好，但今天我得到了一个apache cordova，一切都搞砸了，问题甚至和我不一样提到不同的小工具有不同的问题。

【解决方案2】：

首先使用在线验证器确保您的 html/css 中没有任何错误。

其次，确保您使用的 CSS 在这些设备所具有的 Chrome/Android 版本上可用 (www.caniuse.com)。确保在需要的地方使用浏览器特定的前缀（即不需要新版本的 Chrome，但旧版 Chrome/Webview 需要）。

根据我的经验，Cordova 应用会发现许多问题，尤其是在 Android 上。您的 CSS 很可能没有考虑到移动浏览器之间的所有差异。除非你以前做过，否则不容易做到。

在 Android 上缓解这些问题的另一种方法是使用 Crosswalk 插件。由于您使用的是 VS 2015，因此可以在 config.xml 编辑器中轻松添加。这将增加应用程序的构建时间/大小，但对于严肃的 Android 混合应用程序开发来说，这几乎是必要的。 crosswalk 所做的就是将最新版本的 Chromium 与您的应用程序打包在一起。它使您看到的许多问题都消失了，而且它为您提供了设备上的许多更新的 Web API（例如 webrtc）。

最后一个选择是使用经过测试/支持的库，例如 ionic（如果需要，可以使用他们的 CSS，而不是完整堆栈）、jQuery mobile、Onseen UI 等...您可以将其与 Crosswalk 一起使用以获得在所有 Android 设备/版本上提供非常一致的体验。

【讨论】：

感谢您的详细回答，我会试试看。还有一个问题：我应该做哪些特殊工作才能在不同的小工具上获得相同的结果？正如我现在提到的，它不一样，所以我应该在所有不合逻辑的安卓设备上测试它。多谢。我忘了说我使用 JQueryMobile 它工作正常，但我自己的外部 CSS 不起作用。
您可以在没有设备的情况下使用 GenyMotion 模拟器在不同版本的 Android 上进行测试。如果您使用的是 Android 4.4 或更高版本，请在设备上运行时在 VS 2015 中调试该应用程序。您可以实时更改 CSS 以查看哪些有效/无效。在旧版本的 Android 上，您可以使用 weinre 进行 DOM 调试并在设备上运行时更改 CSS。