javascript - 如何在 VS 代码上调试 Cordova 代码
问题描述
我是 Cordova 和 Android 应用程序的新手。我们在课堂上学习它,所以所有这些代码都只是复制和粘贴,目的是学习如何构建一个项目并在你的手机上运行它。
所以在calculator.js、calculator.css和index.html下面。
当我尝试构建项目时,我不断得到。
:app:generateDebugBuildConfig
FAILURE: Build failed with an exception.
FAILED
* What went wrong:
Execution failed for task ':app:generateDebugBuildConfig'.
> Failed to create C:\Users\mrgaw\Desktop\JS workspace\SWD106\MyCordovaApps\calculator\platforms\android\app\build\generated\source\buildConfig\debug\con\example\calculator
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.
我知道由于项目没有构建而出现问题。我不明白的是出了什么问题。从来没有真正解释过如何调试它,所以我实际上不太确定要真正采取哪些步骤来调试代码。任何指示、提示或建议都会有所帮助。我基本上是在尝试学习如何调试代码,以便了解问题所在。
function registerEventHandlers() {
zero.addEventListener("click", buttonInputClickHandler, false);
one.addEventListener("click", buttonInputClickHandler, false);
two.addEventListener("click", buttonInputClickHandler, false);
three.addEventListener("click", buttonInputClickHandler, false);
four.addEventListener("click", buttonInputClickHandler, false);
five.addEventListener("click", buttonInputClickHandler, false);
six.addEventListener("click", buttonInputClickHandler, false);
seven.addEventListener("click", buttonInputClickHandler, false);
eight.addEventListener("click", buttonInputClickHandler, false);
nine.addEventListener("click", buttonInputClickHandler, false);
add.addEventListener("click", buttonInputClickHandler, false);
subtract.addEventListener("click", buttonInputClickHandler, false);
multiply.addEventListener("click", buttonInputClickHandler, false);
divide.addEventListener("click", buttonInputClickHandler, false);
point.addEventListener("click", buttonInputClickHandler, false);
equals.addEventListener("click", buttonEqualsClickHandler, false);
clear.addEventListener("click", buttonClearClickHandler, false);
}
// handle click event for buttons that enter and display input
function buttonInputClickHandler(eventArg) {
var display = document.getElementById("display");
display.value = display.value + eventArg.target.value;
}
// handle click event for equals button that evaluates and displays result
function buttonEqualsClickHandler(eventArg) {
var display = document.getElementById("display");
display.value = eval(display.value);
}
// handle click event for clearing display
function buttonClearClickHandler(eventArg) {
var display = document.getElementById("display");
display.value = "";
}
#calculator {
display: block;
width: auto;
border: 2px solid black;
padding: 5px;
}
#display {
display: block;
font-size: x-large;
font-family: monospace;
text-align: right;
margin: auto;
width: calc(100% - 10px);
}
.key {
display: block;
box-sizing: border-box;
-moz-box-sizing: border-box;
width: calc(25% - 10px);
height: 100px;
margin: 5px;
background: yellow;
float: left;
font-size: x-large;
font-family: monospace;
}
#equals {
width: calc(100% - 10px);
}
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link rel="stylesheet" type="text/css" href="css/index.css">
<link rel="stylesheet" type="text/css" href="css/calculator.css">
<title>Calculator</title>
</head>
<body onload="registerEventHandlers()">
<div id="deviceready">
<div id="calculator">
<input type="text" id="display">
<input class='key' type="button" id="seven" value="7">
<input class='key' type="button" id="eight" value="8">
<input class='key' type="button" id="nine" value="9">
<input class='key' type="button" id="divide" value="/">
<input class='key' type="button" id="four" value="4">
<input class='key' type="button" id="five" value="5">
<input class='key' type="button" id="six" value="6">
<input class='key' type="button" id="multiply" value="*">
<input class='key' type="button" id="one" value="1">
<input class='key' type="button" id="two" value="2">
<input class='key' type="button" id="three" value="3">
<input class='key' type="button" id="subtract" value="-">
<input class='key' type="button" id="zero" value="0">
<input class='key' type="button" id="point" value=".">
<input class='key' type="button" id="clear" value="Clear">
<input class='key' type="button" id="add" value="+">
<input class='key' type="button" id="equals" value="=">
</div>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="js/calculator.js"></script>
</body>
</html>
解决方案
您不会“在 VS 代码上调试”。您可以使用Visual Studio 2017和 Tools for Apache Cordova 进行调试,或者使用 Chrome 远程调试。查看调试 Cordova 应用程序部分。如果您使用 VS2017,您应该查看该站点或 Microsoft TACO 网站的所有指南(学习和开发也更容易)
请注意,无论您的 JS 文件中有多少错误,都会构建您的 cordova 应用程序,因为它们是独立的东西。如果应用程序生成但随后自行关闭,则您有 JS 错误,在这种情况下您必须使用 Visual Studio 或 Chrome 以及模拟器或 Android 设备开始调试。
此外,我不会为 Cordova 应用程序使用带空格的路径。Cordova 可能比 JAVA 更容易,但对于新手用户来说,理解它所有可能的问题可能会变得非常复杂,因此您确实必须阅读(更多)内容并减少编写代码。
推荐阅读
- asp.net-mvc - 是否有可能出现短暂的 SSL 错误?
- vba - DASL 中的 Outlook 附件名称
- spring - 创建多个微服务实例并将每个实例动态指向其各自的配置
- python-2.7 - Python 2.7:使用 ftplib 检索 netCDF4 文件
- java - 强制 Spring Boot 2 使用 JDK 代理失败
- javascript - Bootstrap 4 输入外部值
- ruby-on-rails - 如何使用线程在工作簿中生成多个工作表 - 在 Ruby on Rails 中使用 axlsx gem?
- java - 使用 PostgreSQL java 进行批量/批量更新
- linux - 未找到 UBI 布局卷
- swift - 如何创建通用 UITableviewCell ,它可以通过委托或其他方式将通用数据类型传递给主 UIViewController?