Jak mogę rejestrować dane lub wiadomości na konsoli w mojej aplikacji Electron?

Ten naprawdę podstawowy świat hello otwiera domyślnie narzędzia programistyczne, których nie mogę używać console.log('hi'). Czy istnieje alternatywa dla 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 działa, ale to, gdzie się loguje, zależy od tego, czy wywołujesz go z procesu głównego, czy z procesu renderowania.

Jeśli wywołasz go z procesu renderowania (tj. JavaScript, który jest zawarty w twoim index.htmlpliku), zostanie zarejestrowany w oknie narzędzi deweloperskich.

Jeśli wywołasz go z głównego procesu (tj. In main.js), będzie działał tak samo, jak w Node - zaloguje się do okna terminala. Jeśli rozpoczynasz proces Electron z terminalu electron ., możesz zobaczyć swoje console.logpołączenia z głównego procesu.

Możesz także dodać zmienną środowiskową w systemie Windows:

ELECTRON_ENABLE_LOGGING=1

Spowoduje to wyświetlenie komunikatów konsoli na twoim terminalu.

Istnieje inny sposób logowania się do konsoli z wnętrza procesu renderowania. Biorąc pod uwagę, że jest to Electron, możesz uzyskać dostęp do natywnych modułów Node. Obejmuje to consolemoduł.

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

Kiedy ten kod jest uruchamiany z wnętrza procesu renderowania, otrzymasz Hello World!terminal, z którego uruchomiłeś Electron.

Więcej dokumentacji na temat modułu można znaleźć pod adresem https://nodejs.org/api/console.htmlconsole .

Jeszcze inną możliwością jest dostęp do głównej konsoli procesu za pomocą remote.getGlobal(name):

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

Dodając do odpowiedzi M. Damiana, oto jak to skonfigurowałem, abym mógł uzyskać dostęp do konsoli głównego procesu z dowolnego renderera.

W swojej głównej aplikacji dodaj:

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

W każdym rendererze możesz dodać:

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

Możesz skorzystać z pakietu npm electron-log https://www.npmjs.com/package/electron-log

Będzie rejestrować twój błąd, ostrzegać, informować, rozwiązywać, debugować, głupie dane wyjściowe w twoim natywnym dzienniku systemu operacyjnego.

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

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

To jest kontynuacja odpowiedzi cscsandy5 na dodatkowe informacje, informacje stąd

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

Ten kod działa świetnie po prostu wyprowadzając prosty komunikat debugowania do okna terminala, z którego uruchomiłeś aplikację electron, i jest tym, na podstawie którego zbudowany jest console.log.

Oto przykładowy fragment (oparty na tutorialspoint electon tutorial) skryptu jQuery, który zapisze cześć do terminala za każdym razem, gdy przycisk zostanie naciśnięty (ostrzeżenie: musisz dodać własne podziały wierszy w łańcuchach wyjściowych!)

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

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

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

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

Wszystko napisał Alex Warren, jest prawdą. Tutaj ważne jest, jak uruchamia się Electron. Jeśli użyjesz standardowego skryptu w pliku package.json , to nie zadziała. Robićconsole.log() pracować, zamień stary skrypt na nowy.

Stary:

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

Nowy:

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

Teraz wszystkie console.log()połączenia są również wyświetlane w terminalu.

Oto, czego używam:

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

Przykładowe zastosowanie (tak samo jak console.log):

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

Źródło: https://github.com/fuse-box/fuse-box-electron-seed/tree/master/src/main w pliku logger.js, tutaj możesz zobaczyć prawdziwy przypadek użycia.

Po pewnym dochodzeniu, oto moje zrozumienie:

Kod

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

Uwaga: którego użyć openDevToolsdo otwarciaElectron Dev Tools

(2) render.js

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

(3) render.jsjest wywoływany przez:index.html

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

console.log

Logika wyjściowa

• dwa procesy i jego dane wyjściowe console.log :
  • main process= NodeJS process= tutajElectron UI process
    • -> console.login main.jswyświetli tutaj log
  • render process
    • -> console.login render.jswyświetli tutaj log

Przykład zrzutu ekranu

• DEBUG = tryb programowania
  • biegać ./node_modules/.bin/electron .
    • 
• Produkcja = Tryb wydania = xxx.app zapakowany przezeletron-builder
  • biegać /path_to_your_packaged_mac_app/xxx.app/Contents/MacOS/yourBinaryExecutable
    • 
  • dodane export ELECTRON_ENABLE_LOGGING=true, render.jsconsole.log TAKŻE wyjście do main processterminala
    • 

Przepraszam, że podnoszę stary wątek, ale to jest najlepszy wynik dla zapytania „jak przesłać plik console.log do terminala” (lub podobnych wyszukiwań.

Dla każdego, kto chce uzyskać nieco większą kontrolę nad tym, co jest wyświetlane na terminalu, możesz użyć webContents.on ('komunikat konsoli') w następujący sposób:

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

Widzieć:

webContents Dokumentacja

webContents w dokumentacji BrowserWindow

console.log()będzie działać dobrze do debugowania. Ponieważ electronjest zbudowany w oparciu o przeglądarkę, DevToolsobsługuje narzędzia programistyczne do debugowania. Istnieje jednak histeryczne zachowanie console.log()metody. Gdy wywołasz aplikację console.log()from main processelectron app, zostanie ona wyświetlona w oknie terminala, z którego właśnie uruchomiłeś aplikację, a po wywołaniu jej z renderer processniej wyświetli się na konsoli DevTools.

Dzięki temu możesz użyć narzędzi programistycznych w głównym oknie przeglądarki, aby wyświetlić dzienniki

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

Przykład logEverywhere('test') pojawi się // testw panelu konsoli narzędzi programistycznych głównego okna przeglądarki

Możesz potrzebować ulepszenia tej metody, aby akceptować wiele argumentów (możesz to zrobić za pomocą operatora spreadu za pomocą es6)

Cóż, to rok 2019 i nie mogę uwierzyć, że nikt nie wspomniał o tej sztuczce we wszystkich powyższych odpowiedziach. Ok, a co powiesz na zalogowanie się bezpośrednio do konsoli przeglądarki bezpośrednio z głównej? Podałem moją odpowiedź tutaj: https://stackoverflow.com/a/58913251/8764808 Spójrz.