参照エラー：コンパイル/電子でドキュメントが定義されていません

Question

電子アプリケーションを作成しようとしていますが、メインプロセスでJavascriptエラーが発生しています。基本的に私はnpm start後にこのエラーが表示されます。ここでは

ReferenceError: document is not defined at compile (/Users/ege/Desktop/electron/main.js:23:13) at Object. (/Users/ege/Desktop/electron/main.js:35:1) at Object. (/Users/ege/Desktop/electron/main.js:37:3) at Module._compile (module.js:571:32) at Object.Module._extensions..js (module.js:580:10) at Module.load (module.js:488:32) at tryModuleLoad (module.js:447:12) at Function.Module._load (module.js:439:3) at loadApplicationPackage (/Users/ege/Desktop/electron/node_modules/electron/dist/Electron.app/Contents/Resources/default_app.asar/main.js:283:12) at Object. (/Users/ege/Desktop/electron/node_modules/electron/dist/Electron.app/Contents/Resources/default_app.asar/main.js:325:5)

はmain.jsです：

const electron = require('electron'); 
const app = electron.app; 
const path = require('path'); 
const url = require('url'); 

const BrowserWindow = electron.BrowserWindow; 
var mainWindow; 

app.on('ready',function(){ 

mainWindow = new BrowserWindow({width:1024 , height: 768 , backgroundColor:'#2e2c29'}); 
    mainWindow.loadURL(url.format({ 
    pathname:path.join(__dirname,'index.html'), 
    protocol:'file:', 
    slashes:true 

})); 

}); 

function compile() { 

    var html = document.getElementById("html"); 
    var css = document.getElementById("css"); 
    var js = document.getElementById("js"); 
    var code = document.getElementById("code").contentWindow.document; 

    document.body.onkeyup = function(){ 
     code.open(); 
     code.writeln(html.value+"<style>"+css.value+"</style>"+"<script>" + js.value + "</script>"); 
     code.close(); 
     }; 
    }; 


compile(); 

Answer 1

は私が愚かだということを知るために2分かかりました。 app.jsという名前の別のjsファイルを作成して追加します：

function compile() { 

    var html = document.getElementById("html"); 
    var css = document.getElementById("css"); 
    var js = document.getElementById("js"); 
    var code = document.getElementById("code").contentWindow.document; 

    document.body.onkeyup = function(){ 
     code.open(); 
     code.writeln(html.value+"<style>"+css.value+"</style>"+"<script>" + js.value + "</script>"); 
     code.close(); 
     }; 
    }; 


compile(); 

があります。問題が解決しました。