Como posso registrar dados ou mensagens no console do meu aplicativo Electron?

Este Hello World realmente básico abre as ferramentas de desenvolvimento por padrão, mas não consigo usar console.log('hi'). Existe uma alternativa para o 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, mas para onde ele se conecta depende de você chamá-lo do processo principal ou do processo de renderização.

Se você chamá-lo do processo de renderização (ou seja, JavaScript que está incluído em seu index.htmlarquivo), ele será registrado na janela de ferramentas de desenvolvimento.

Se você chamá-lo a partir do processo principal (ou seja, em main.js), ele funcionará da mesma maneira que no Node - ele será registrado na janela do terminal. Se você estiver iniciando o processo Electron do Terminal usando, electron .poderá ver suas console.logchamadas do processo principal lá.

Você também pode adicionar uma variável de ambiente no Windows:

ELECTRON_ENABLE_LOGGING=1

Isso irá gerar mensagens de console para o seu terminal.

Existe outra maneira de fazer logon no console de dentro do processo de renderização. Dado que este é o Electron, você pode acessar os módulos nativos do Node. Isso inclui o consolemódulo.

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

Quando este código é executado de dentro do processo de renderização, você obterá Hello World!o terminal a partir do qual executou o Electron.

Consulte https://nodejs.org/api/console.html para obter mais documentação sobre o consolemódulo.

Outra possibilidade é acessar o console de processo principal usando remote.getGlobal(name):

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

Somando-se à resposta de M. Damian, aqui está como eu configurei para poder acessar o console do processo principal de qualquer renderizador:

em seu aplicativo principal, adicione:

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

em qualquer renderizador, você pode adicionar:

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

Você pode usar o pacote npm electron-log https://www.npmjs.com/package/electron-log

Ele irá registrar seu erro, aviso, informações, verbose, depuração, saídas bobas em seu log do sistema operacional nativo.

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

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

Esta é uma continuação da resposta de cscsandy5 para algumas informações adicionais, informações aqui

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

Este código funciona muito bem apenas para enviar uma mensagem de depuração simples para a janela do terminal a partir da qual você iniciou o aplicativo electron e é sobre o que console.log é construído.

Aqui está um trecho de exemplo (baseado em tutorialspoint electon tutorial) de um script jQuery que escreverá olá para o terminal toda vez que o botão for pressionado (aviso: você precisa adicionar suas próprias quebras de linha nas strings de saída!)

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

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

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

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

Tudo o que Alex Warren escreveu é verdade. Importante aqui é como o Electron é iniciado. Se você usar o script padrão no arquivo package.json, ele não funcionará. Para fazer console.log()funcionar, substitua o script antigo por este novo.

Antigo:

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

Novo:

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

Agora, todas as console.log()chamadas são exibidas no terminal também.

Isso é o que eu 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 + "');");
}

Exemplo de uso (igual a console.log):

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

Fonte: https://github.com/fuse-box/fuse-box-electron-seed/tree/master/src/main no arquivo logger.js, aqui você pode ver um caso de uso real.

Após alguma investigação, aqui está o meu entendimento:

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 use openDevToolspara abrirElectron Dev Tools

(2) render.js

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

(3) render.jsé chamado por:index.html

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

console.log

Saída Lógica

• dois processos e sua saída console.log :
  • main process= NodeJS process= aquiElectron UI process
    • -> console.logem main.jsirá gerar o log para aqui
  • render process
    • -> console.logem render.jsirá gerar o log para aqui

Exemplo de captura de tela

• DEBUG = modo de desenvolvimento
  • corre ./node_modules/.bin/electron .
    • 
• Produção = modo de liberação = o xxx.app compactado poreletron-builder
  • corre /path_to_your_packaged_mac_app/xxx.app/Contents/MacOS/yourBinaryExecutable
    • 
  • adicionado export ELECTRON_ENABLE_LOGGING=true, render.jsconsole.log TAMBÉM saída para o main processterminal
    • 

Desculpe levantar um tópico antigo, mas este é o principal resultado para "como enviar console.log para o terminal" (ou pesquisas semelhantes.

Para quem deseja obter um pouco mais de controle sobre o que é enviado para o terminal, você pode usar webContents.on ('console-message') assim:

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

Vejo:

Documentação webContents

entrada webContents nos documentos do BrowserWindow

console.log()funcionará bem para depuração. Como o electroné construído em cima do navegador, ele tem DevToolssuporte para você usar devtools para fins de depuração. No entanto, existe um comportamento histérico do console.log()método. Quando você chama o aplicativo console.log()from main processdo electron, ele será enviado para a janela do terminal de onde você acabou de renderer processiniciar o aplicativo e, quando você chamá- lo, será enviado para o console do DevTools.

Com isso, você pode usar as ferramentas de desenvolvedor da janela principal do navegador para ver os logs

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

O exemplo logEverywhere('test') será gerado // testno painel do console das ferramentas de desenvolvedor da janela principal do navegador

Você pode precisar aprimorar este método para aceitar vários argumentos (você pode fazer isso com o operador spread por es6)

Bem, estamos em 2019 e não acredito que ninguém mencionou esse truque em todas as respostas acima. Ok, então, que tal fazer login diretamente no console do navegador diretamente do principal? Forneci minha resposta aqui: https://stackoverflow.com/a/58913251/8764808 Dê uma olhada.