web-dev-qa-db-ja.com

Electronアプリでconsole.log（）を使用する

Electronアプリでデータやメッセージをコンソールに記録するにはどうすればよいですか？

この本当に基本的なhello worldは、デフォルトではdevツールを開きますが、console.log('hi')を使用することはできません。 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;
  });
});
electron
96
Don P

console.logは機能しますが、ログを記録する場所は、メインプロセスとレンダラープロセスのどちらから呼び出すかによって異なります。

レンダラープロセス（つまり、index.htmlファイルに含まれるJavaScript）から呼び出すと、開発ツールウィンドウに記録されます。

メインプロセス（つまり、main.js）から呼び出すと、Nodeの場合と同じように動作します-ターミナルウィンドウにログが記録されます。 electron .を使用してターミナルからElectronプロセスを開始している場合、そこのメインプロセスからconsole.log呼び出しを確認できます。

126
Alex Warren

Windowsで環境変数を追加することもできます。

ELECTRON_ENABLE_LOGGING=1

これにより、端末にコンソールメッセージが出力されます。

33
deejbee

レンダラープロセス内からコンソールにログインする別の方法があります。これがElectronの場合、Nodeのネイティブモジュールにアクセスできます。これにはconsoleモジュールが含まれます。

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

このコードをレンダラープロセス内から実行すると、Electronを実行したターミナルでHello World!が取得されます。

consoleモジュールの詳細なドキュメントについては、 https://nodejs.org/api/console.html を参照してください。

23
M. Damian Mulligan

さらに別の可能性は、 remote.getGlobal(name) を使用してメインプロセスコンソールにアクセスすることです。

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

M. Damianの答えに加えて、どのレンダラーからメインプロセスのコンソールにアクセスできるように設定する方法は次のとおりです。

メインアプリに以下を追加します。

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

任意のレンダラーで追加できます：

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

これは、追加情報に関するcscsandy5の回答のフォローアップです。 here からの情報

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

このコードは、electronアプリを起動したターミナルウィンドウに単純なデバッグメッセージを出力するのに最適であり、console.logの上に構築されます。

ボタンが押されるたびにターミナルにhelloを書き込むjQueryスクリプトのサンプルスニペット（tutorialspoint electonチュートリアルに基づく）があります（警告：出力文字列に独自の改行を追加する必要があります！）

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

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

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

    $('#click-counter').text(clicks);
});
4
Harrison Telfer
process.stdout.write('your output to command Prompt console or node js ')
3
cscsandy5

Npmパッケージelectron-logを使用できます https://www.npmjs.com/package/electron-log

エラー、警告、情報、詳細、デバッグ、愚かな出力をネイティブOSログに記録します。

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

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

すべて Alex Warrenが書いた は本当です。ここで重要なのは、Electronの起動方法です。 package.jsonファイルで標準スクリプトを使用すると、機能しません。 console.log()を機能させるには、古いスクリプトをこの新しいスクリプトに置き換えます。

古いもの：

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

新しいもの：

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

これで、すべてのconsole.log()呼び出しが端末にも表示されます。

2
jixaw

これは私が使用するものです：

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

使用例（console.logと同じ）：

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

ソース： https://github.com/Fuse-box/Fuse-box-electron-seed/tree/master/src/main logger.jsファイルで、実際の使用方法を確認できます場合。

1
Carlos Galarza

古いスレッドを発生させて申し訳ありませんが、これは「console.logを端末に出力する方法」（または同様の検索）の上位結果です。

端末への出力をもう少し制御したい場合は、webContents.on（ 'console-message'）を次のように使用できます。

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

見る：

webContents Documentation

BrowserWindow docsのwebContentsエントリ

0
M. Richardson

console.log()はデバッグ用に正常に機能します。 electronはブラウザの上に構築されているため、DevToolsのサポートがあり、デバッグ目的でdevtoolsを使用できます。ただし、console.log()メソッドにはヒステリックな動作があります。 electronアプリのmain processからconsole.log()を呼び出すと、アプリを起動した場所からターミナルウィンドウに出力され、renderer processから呼び出すとDevToolsに出力されますコンソール。

0
Kiran Maniya