Wie kann ich Daten oder Nachrichten in meiner Electron-App an der Konsole protokollieren?

Diese wirklich einfache Hallo-Welt öffnet standardmäßig die Entwickler-Tools, da ich sie nicht verwenden kann console.log('hi'). Gibt es eine Alternative für 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 funktioniert, aber wo es sich anmeldet, hängt davon ab, ob Sie es vom Hauptprozess oder vom Renderer-Prozess aufrufen.

Wenn Sie es vom Renderer-Prozess aus aufrufen (dh JavaScript, das in Ihrer index.htmlDatei enthalten ist), wird es im Fenster der Entwicklungstools protokolliert.

Wenn Sie es vom Hauptprozess (dh von main.js) aus aufrufen, funktioniert es genauso wie in Node - es wird im Terminalfenster protokolliert. Wenn Sie Ihren Electron-Prozess vom Terminal aus starten electron ., können Sie Ihre console.logAnrufe vom dortigen Hauptprozess aus sehen.

Sie können in Windows auch eine Umgebungsvariable hinzufügen:

ELECTRON_ENABLE_LOGGING=1

Dadurch werden Konsolennachrichten an Ihr Terminal ausgegeben.

Es gibt eine andere Möglichkeit, sich innerhalb des Renderer-Prozesses an der Konsole anzumelden. Wenn dies Electron ist, können Sie auf die nativen Module von Node zugreifen. Dies beinhaltet das consoleModul.

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

Wenn dieser Code im Renderer-Prozess ausgeführt wird, gelangen Sie Hello World!in das Terminal, von dem aus Sie Electron ausgeführt haben.

Weitere Dokumentation zum Modul finden Sie unter https://nodejs.org/api/console.htmlconsole .

Eine weitere Möglichkeit ist der Zugriff auf die Hauptprozesskonsole über remote.getGlobal(name):

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

Neben der Antwort von M. Damian habe ich Folgendes eingerichtet, damit ich von jedem Renderer aus auf die Konsole des Hauptprozesses zugreifen kann:

Fügen Sie in Ihrer Haupt-App Folgendes hinzu:

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

In jedem Renderer können Sie hinzufügen:

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 ')

Sie können das Elektronenprotokoll des npm-Pakets https://www.npmjs.com/package/electron-log verwenden

Es protokolliert Ihre Fehler-, Warn-, Info-, ausführlichen, Debug- und albernen Ausgaben in Ihrem nativen Betriebssystemprotokoll.

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

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

Dies ist eine Fortsetzung der Antwort von cscsandy5 für einige zusätzliche Informationen, Informationen von hier

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

Dieser Code eignet sich hervorragend für die Ausgabe einer einfachen Debug-Nachricht an das Terminalfenster, über das Sie die Elektronen-App gestartet haben. Darauf baut console.log auf.

Hier ist ein Beispiel-Snippet (basierend auf dem Tutorialspoint electon tutorial) eines jQuery-Skripts, das bei jedem Drücken der Taste Hallo an das Terminal schreibt (Warnung: Sie müssen Ihre eigenen Zeilenumbrüche in die Ausgabezeichenfolgen einfügen!).

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

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

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

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

Alles, was Alex Warren schrieb, ist wahr. Wichtig ist hier, wie Electron gestartet wird. Wenn Sie das Standardskript in der Datei package.json verwenden, funktioniert es nicht. console.log()Ersetzen Sie das alte Skript durch das neue, damit es funktioniert.

Altes:

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

Ein neues:

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

Jetzt werden alle console.log()Anrufe auch im Terminal angezeigt.

Das benutze ich:

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 + "');");
}

Anwendungsbeispiel (wie console.log):

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

Quelle: https://github.com/fuse-box/fuse-box-electron-seed/tree/master/src/main in der Datei logger.js. Hier sehen Sie einen realen Anwendungsfall.

Nach einigen Nachforschungen hier mein Verständnis:

Code

(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
  })
}
...

Hinweis: welche openDevToolszum öffnen verwendenElectron Dev Tools

(2) render.js

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

(3) render.jsheißt:index.html

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

console.log

Ausgabelogik

• Zwei Prozesse und die Ausgabe von console.log :
  • main process= NodeJS process= hierElectron UI process
    • -> console.login main.jsgibt das Protokoll hier aus
  • render process
    • -> console.login render.jsgibt das Protokoll hier aus

Screenshot Beispiel

• Debug = Entwicklungsmodus
  • Lauf ./node_modules/.bin/electron .
    • 
• Produktion = Freigabe mode = die xxx.app pacakged durcheletron-builder
  • Lauf /path_to_your_packaged_mac_app/xxx.app/Contents/MacOS/yourBinaryExecutable
    • 
  • hinzugefügt export ELECTRON_ENABLE_LOGGING=true, render.jsconsole.log AUCH Ausgabe an main processTerminal
    • 

Es tut uns leid, einen alten Thread zu erstellen, aber dies ist das Top-Ergebnis für "Ausgabe von console.log an Terminal" (oder ähnliche Suchvorgänge).

Für alle, die etwas mehr Kontrolle über die Ausgabe auf dem Terminal erlangen möchten, können Sie webContents.on ('Konsolennachricht') wie folgt verwenden:

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

Sehen:

webContents-Dokumentation

webContents-Eintrag in BrowserWindow-Dokumenten

console.log()funktioniert gut für das Debuggen. Da das electronauf dem Browser DevToolsbasiert , bietet es Unterstützung, dass Sie devtools zum Debuggen verwenden können. Es gibt jedoch ein hysterisches Verhalten der console.log()Methode. Wenn Sie den Anruf console.log()aus main processden Elektronen App, gibt er an das Terminalfenster , von dem Sie nur die App gestartet und wenn Sie es aus rufen renderer processsie an die DevTools Konsole ausgibt.

Mit diesem können Sie Entwicklertools des Hauptbrowserfensters verwenden, um Protokolle anzuzeigen

    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}")`);
            }
        }
    }

Das Beispiel logEverywhere('test') wird // testim Konsolenfenster der Entwicklertools des Hauptbrowserfensters ausgegeben

Möglicherweise müssen Sie diese Methode verbessern, um mehrere Argumente zu akzeptieren (Sie können dies mit dem Spread-Operator von es6 tun).

Nun, dies ist 2019 und ich kann nicht glauben, dass niemand diesen Trick in allen obigen Antworten erwähnt hat. Ok, wie wäre es, wenn Sie sich direkt von der Hauptkonsole aus direkt bei der Browserkonsole anmelden? Ich habe meine Antwort hier gegeben: https://stackoverflow.com/a/58913251/8764808 Schauen Sie mal rein.