¿Cómo puedo registrar datos o mensajes en la consola en mi aplicación Electron?

Este hola mundo realmente básico abre las herramientas de desarrollo de forma predeterminada, por lo que no puedo usar console.log('hi'). ¿Existe una alternativa para Electron?

main.js

var app = require('app');
var BrowserWindow = require('browser-window');

require('crash-reporter').start();

var mainWindow = null;

app.on('window-all-closed', function() {
  // Mac OS X - close is done explicitly with Cmd + Q, not just closing windows
  if (process.platform != 'darwin') {
    app.quit();
  }
});

app.on('ready', function(){
  mainWindow = new BrowserWindow({ width: 800, height: 600});

  mainWindow.loadUrl('file://' + __dirname + '/index.html');

  mainWindow.openDevTools();

  mainWindow.on('closed', function(){
    mainWindow = null;
  });
});

console.log funciona, pero dónde se registra depende de si lo llama desde el proceso principal o desde el proceso del renderizador.

Si lo llama desde el proceso de renderizado (es decir, JavaScript que se incluye en su index.htmlarchivo), se registrará en la ventana de herramientas de desarrollo.

Si lo llama desde el proceso principal (es decir, en main.js), funcionará de la misma manera que en Node: se registrará en la ventana de terminal. Si está iniciando su proceso de Electron desde la Terminal usando electron ., puede ver sus console.logllamadas desde el proceso principal allí.

También puede agregar una variable de entorno en Windows:

ELECTRON_ENABLE_LOGGING=1

Esto enviará mensajes de la consola a su terminal.

Hay otra forma de iniciar sesión en la consola desde el interior del proceso de renderizado. Dado que esto es Electron, puede acceder a los módulos nativos de Node. Esto incluye el consolemódulo.

var nodeConsole = require('console');
var myConsole = new nodeConsole.Console(process.stdout, process.stderr);
myConsole.log('Hello World!');

Cuando este código se ejecuta desde dentro del proceso de renderizado, accederá Hello World!a la terminal desde la que ejecutó Electron.

Consulte https://nodejs.org/api/console.html para obtener más documentación sobre el consolemódulo.

Otra posibilidad más es acceder a la consola de proceso principal usando remote.getGlobal(name):

const con = require('electron').remote.getGlobal('console')
con.log('This will be output to the main process console.')

Agregando a la respuesta de M. Damian, así es como lo configuré para poder acceder a la consola del proceso principal desde cualquier renderizador.

En su aplicación principal, agregue:

const electron = require('electron');
const app = electron.app;
const console = require('console');
...
app.console = new console.Console(process.stdout, process.stderr);

En cualquier renderizador, puede agregar:

const remote = require('electron').remote;
const app = remote.app;
...
app.console.log('This will output to the main process console.');

process.stdout.write('your output to command prompt console or node js ')

Puede utilizar el paquete npm electron-log https://www.npmjs.com/package/electron-log

Registrará su error, advertencia, información, detallado, depuración, salidas tontas en su registro de sistema operativo nativo.

var log = require('electron-log');

log.info('Hello, log');
log.error('Damn it, an error');

Este es un seguimiento de la respuesta de cscsandy5 para obtener información adicional, información de aquí

process.stdout.write('your output to command prompt console or node js ')

Este código funciona muy bien para enviar un simple mensaje de depuración a la ventana de terminal desde la que inició la aplicación electron y es sobre lo que se construye console.log.

Aquí hay un fragmento de ejemplo (basado en el tutorial de tutorialspoint electon) de un script de jQuery que escribirá hola en el terminal cada vez que se presione el botón (advertencia: ¡debe agregar sus propios saltos de línea en las cadenas de salida!)

let $ = require('jquery')
var clicks = 0;

$(function() {
    $('#countbtn').click(function() {
        //output hello <<<<<<<<<<<<<<<<<<<<<<<
        process.stdout.write('hello')

        $('#click-counter').text(++clicks);
    });

    $('#click-counter').text(clicks);
});

Todo lo que escribió Alex Warren es cierto. Aquí es importante cómo se inicia Electron. Si usa el script estándar en el archivo package.json , no funcionará. Para que console.log()funcione, reemplace el antiguo script por este nuevo.

El viejo:

"scripts": {
    "start": "electron ."
}

Uno nuevo:

"scripts": {
    "start": ".\\node_modules\\electron\\dist\\electron.exe ."
}

Ahora todas las console.log()llamadas también se muestran en el terminal.

Esto es lo que uso:

let mainWindow // main window reference, you should assign it below 'mainWindow = new BrowserWindow'

function log(...data) {
  mainWindow.webContents.executeJavaScript("console.log('%cFROM MAIN', 'color: #800', '" + data + "');");
}

Uso de ejemplo (igual que console.log):

log('Error', { msg: 'a common log message' })
log('hello')

Fuente: https://github.com/fuse-box/fuse-box-electron-seed/tree/master/src/main en el archivo logger.js, aquí puede ver un caso de uso real.

Después de alguna investigación, aquí mi entendimiento:

Código

(1) main.js

const createPyProc = () => {
  console.log('In createPyProc')
...
  console.log('scriptStart=%s', scriptStart)
...
  console.log('scriptOther=%s', scriptOther)
...
}

...

let mainWindow = null

const createWindow = () => {
  mainWindow = new BrowserWindow(
    {
      width: 1024,
      height: 768,
      webPreferences: {
        nodeIntegration: true,
      }
    }
  )
  mainWindow.loadURL(require('url').format({
    pathname: path.join(__dirname, 'index.html'),
    protocol: 'file:',
    slashes: true
  }))
  mainWindow.webContents.openDevTools()

  mainWindow.on('closed', () => {
    mainWindow = null
  })
}
...

Nota: que uso openDevToolspara abrirElectron Dev Tools

(2) render.js

const zerorpc = require("zerorpc")
...
    console.log("clientStart %d server is ready", PORT_START)
...
})

(3) render.jses llamado por:index.html

<!DOCTYPE html>
<html>
...
  <script>
    require('./renderer.js')
  </script>
</html>

console.log

Lógica de salida

• dos procesos y su salida console.log :
  • main process= NodeJS process= aquíElectron UI process
    • -> console.login main.jsdará salida al registro aquí
  • render process
    • -> console.login render.jsdará salida al registro aquí

Ejemplo de captura de pantalla

• DEBUG = Modo de desarrollo
  • correr ./node_modules/.bin/electron .
    • 
• Producción = Modo de lanzamiento = el paquete xxx.app cargado poreletron-builder
  • correr /path_to_your_packaged_mac_app/xxx.app/Contents/MacOS/yourBinaryExecutable
    • 
  • agregado export ELECTRON_ENABLE_LOGGING=true, render.jsconsole.log TAMBIÉN salida a la main processterminal
    • 

Perdón por levantar un hilo antiguo, pero este es el resultado principal de "cómo enviar console.log a la terminal" (o búsquedas similares.

Para cualquiera que busque obtener un poco más de control sobre lo que se envía al terminal, puede usar webContents.on ('console-message') así:

mainWindow.webContents.on('console-message', (event, level, message, line, sourceId) => {
      console.log(message + " " +sourceId+" ("+line+")");
});

Ver:

WebContents Documentación

entrada webContents en los documentos de BrowserWindow

console.log()funcionará bien para la depuración. Como electronestá construido sobre el navegador, tiene DevToolssoporte, puede usar devtools con fines de depuración. Sin embargo, hay un comportamiento histérico de console.log()método. Cuando llame a la aplicación console.log()from main processof electron, saldrá a la ventana de terminal desde donde acaba de iniciar la aplicación y cuando la llame desde renderer process, saldrá a la consola DevTools.

Con esto, puede usar las herramientas de desarrollo de la ventana principal del navegador para ver los registros

    function logEverywhere(s) {
        if (_debug === true) {
            console.log(s);
            // mainWindow is main browser window of your app
            if (mainWindow && mainWindow.webContents) {
                mainWindow.webContents.executeJavaScript(`console.log("${s}")`);
            }
        }
    }

El ejemplo logEverywhere('test') aparecerá // testen el panel de la consola de las herramientas de desarrollo de la ventana principal del navegador.

Es posible que necesite mejorar este método para aceptar múltiples argumentos (puede hacerlo con el operador de propagación por es6)

Bueno, esto es 2019 y no puedo creer que nadie haya mencionado este truco en todas las respuestas anteriores. Bien, entonces, ¿qué tal iniciar sesión directamente en la consola del navegador directamente desde la pantalla principal? Proporcioné mi respuesta aquí: https://stackoverflow.com/a/58913251/8764808 Eche un vistazo.