Anteriormente vimos como podemos usar plugins como Comunicación entre procesos en Electron.js, por lo tanto al tener un esquema de una aplicación más completa, es hora de conocer una herramienta fundamental al momento de desarrollar nuestras aplicaciones web, una herramienta que siempre tenemos a la mano es el uso de la consola de desarrolladores del navegador o devTools para hacer debug a la misma, en Electron, también la podemos usar fácilmente, para ello, tenemos que activar la misma en el objeto BrowserWindow():
index.js
function createWindow(){
let win = new BrowserWindow({
width: 800,
height:600,
webPreferences:{
nodeIntegration: true,
contextIsolation: false
}
})
win.loadFile("index.html")
win.webContents.openDevTools()
}index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>App Electron</h1>
</body>
</html>Con esto, cualquier error que suceda en el proceso de renderizado o página web, lo veremos por la consola, asi que, al ejecutar la aplicación, tendremos:
Siguiente paso, habilitar la integración con Node.
Acepto recibir anuncios de interes sobre este Blog.
Conoceremos como abrir la consola de desarrolladores en una ventana en Electron.