ipcmain.js
var {ipcMain,BrowserWindow} =require('electron'); var path=require('path'); var win=null; //接收到广播 ipcMain.on('openWindow',function(){ //调用 BrowserWindow打开新窗口 win=new BrowserWindow({ 400, height:300, // frame:false, // fullscreen:true }) win.loadURL(path.join('file:',__dirname,'../news.html')); win.webContents.openDevTools(); win.on('closed',()=>{ win=null; }) })
openwindow.js
var {ipcRenderer} =require('electron'); var btn=document.querySelector('#btn'); //渲染进程没法直接调用主进程中的模块，但是我们可以通过 electron中的remote模块间接的调用主进程中的模块 btn.onclick=function(){ // alert('点击了'); ipcRenderer.send('openWindow'); }
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> .content{ width: 100%; height: 400px; background: orange; overflow-y: auto; } </style> </head> <body> <button id="btn"> 打开新窗口 </button> <script src="renderer/openWindow.js"></script> </body> </html>
index.js 引入
require('./main/ipcMain.js');
运行即可
npm run start