如何在VS代码上调试Cordova代码
[英]How to debug Cordova code on VS code
问题描述
I am new to Cordova and android apps. 
我是Cordova和android应用程序的新手。 We are learning it in class, so all this code is just copied and pasted with the purpose of learning how to build a project and run it on your phone. 我们正在课堂上学习它，因此所有这些代码都只是复制和粘贴，目的是学习如何构建项目并在手机上运行它。
So in calculator.js, calculator.css, and index.html below. 因此，在下面的Calculator.js，calculator.css和index.html中。
When I tried to build the project I keep getting. 当我尝试构建项目时，我不断得到。
: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.
I get that there is something wrong as a result the project did not build. 我得到一个错误的结果是该项目没有建立。 What I dont get is what went wrong. 我不明白的是出了什么问题。 It was never really explained on how to debug this so I'm actually not quite sure of what steps to really take to debug the code. 从来没有真正解释过如何调试它，所以我实际上不确定要真正调试代码的步骤。 Any pointers, tips, or advice would help. 任何指示，技巧或建议都将有所帮助。 I'm basically trying to learn how to debug code so I can learn whats wrong. 我基本上是在尝试学习如何调试代码，以便我可以了解错误之处。
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>
1 个解决方案
解决方案1
0 2018-06-24 01:31:31
You do not "debug on VS code". 您不会“在VS代码上调试”。 You can debug with Visual Studio 2017 and Tools for Apache Cordova, or using Chrome Remote Dubugging. 您可以使用Visual Studio 2017和适用于Apache Cordova的工具进行调试，也可以使用Chrome远程调试。 Check out the Debugging Cordova Apps section. 请查看“ 调试Cordova应用程序”部分。 You should check out all guides from that site or from the Microsoft TACO website if you go with VS2017 ( much easier for learning and developing too) 如果您使用VS2017，则应该从该站点或Microsoft TACO网站中查看所有指南（对于学习和开发也要容易得多 ）
Notice that your cordova app will be built regardless of the amount of errors in your JS files, because they are separate things. 请注意，无论JS文件中的错误数量如何，都将构建cordova应用程序，因为它们是分开的。 If the app builds but then it closes itself, then you have JS errors and you must start debugging in this case using Visual Studio or Chrome and the Emulator or an Android device. 如果应用程序能够生成，但随后会自行关闭，则说明您遇到JS错误，并且在这种情况下必须使用Visual Studio或Chrome浏览器以及仿真器或Android设备开始调试。
Also, I wouldn't use paths with spaces for Cordova apps. 另外，我不会为Cordova应用程序使用带空格的路径。 Cordova might be easier than JAVA but it can become extremely complex to understand all its possible issues for the novice user, so you really must read (much) more and code less to begin with. Cordova可能比JAVA容易，但是对于初学者来说，了解所有可能出现的问题可能变得非常复杂，因此从一开始，您实际上必须多读（少读）很多代码。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.