随笔分类 - Debug
摘要:Example code: function createIncrease() { const doms = new Array(100000).fill(0).map((_, i) => { const dom = document.createElement('div'); dom.innerH
阅读全文
摘要:Example Code: <body> <div> <button class="btn" onclick="createInput(false)"> Button1</button> <button class="btn" onclick="createInput(true)">Button2<
阅读全文
摘要:Example code: <template> <button @click="handleClick">Hello, Vue-CLI</button> </template> <script> export default { methods: { handleClick() { const a
阅读全文
摘要:You can use getEventListeners(button)directly inside chrome devtool, but not inside application code. You can use monitorEvents(button, 'keydown'), no
阅读全文
摘要:function getTimeNow() { const now = new Date().toLocaleTimeString( 'en-US', { hour12: false } ); return now; } function info(functionName: string, ...
阅读全文
摘要:Chrome DevTools provide many handy utility functions that we can use to make debugging faster and easier so we can fix the bug and move on. In this le
阅读全文
摘要:Sometimes you encounter a backend issue which seems to occur only on your computer, with a very specific sets of headers, cookies etc. Because of that
阅读全文
摘要:Install: npm i debug supports-color --save Docs Code: // stdout.js var debug = require('debug'); var error = debug('app:error'); // by default stderr
阅读全文
摘要:When building a web app, sometimes we need to approach it top-down. Modern browser devtools allow us to set breakpoints not only on the JS code but al
阅读全文
摘要:TO debug NestJS code with Chrome dev tool, we can run: TO make it easier for us running this later, we can do: After running this script, you cannot s
阅读全文
摘要:Chrome dev tool has "Pasue on caught exceptions" which is useful when there is expection throw. It pause the excution and you can check "Scope" to see
阅读全文
摘要:For example you have the following code; If you want to debug is in Node, you can do: Then in cmd, run: Then just type 'continue' or just 'c'. It will
阅读全文
摘要:For example you have a server.js file, and you want to debug some problems; What you can do is: Then go to chrome broswer: You will find node.js targe
阅读全文
摘要:When using ADTs in our code base, it can be difficult to use common debugging tools like watches and breakpoints. This is mainly due to the common pat
阅读全文
摘要:Source: https://blog.angularindepth.com/debug-angular-apps-in-production-without-revealing-source-maps-ab4a235edd85 Build application with source map:
阅读全文
摘要:Your page is showing high CPU usage and spinning up your laptop fan, but nothing is visibly happening. What is it doing, and why is it so slow? This l
阅读全文
摘要:It’s handy to inspect an element in your browser’s DevTools when you need to experiment or tweak it’s styles, however, it can be very tricky to try an
阅读全文
摘要:Meet some problem when trying to install node-sass on windwos. Company has proxy settings, need to remember to set proxy settings in .npmrc file:
阅读全文
摘要:For example we have the following code: Because we wrote as function component, it is using the implicit return. To debug what props have been passed
阅读全文
摘要:The Element Inspector in Chrome DevTools offers powerful integration with the console - learn how to programmatically navigate your selected element,
阅读全文