Debugging Electron applications is very similar to debugging JavaScript code for web applications. But here we need to take care of different types of Electron processes. The main process and renderer process (or the rendered web page) should be debugged separately as these processes are running separately. In the following sections, we will look at how to debug both of these processes. We have a couple of options to debug the application. This chapter will provide you with step-by-step instructions to fix development bugs easily with debuggers.

Nowadays, most editors provide great debugging support for Node.js applications. In addition, node binaries provide built-in support for debugging the application via Chrome Developer Tools. Electron can also make use of these tools to debug the application. This section will provide you with step-by-step explanations on how to use Visual Studio Code and Chrome Developer Tools to debug both the main process and renderer processes in an Electron application. You can use either Visual Studio Code or Chrome Developer Tools to debug the application. We will also discuss some other tools that can make a developer's life easier when working with Electron.