VSCode 使用electron主进程调用js文件

1. package.json

{
    "name": "electrontest",
    "version": "0.1.0",
    "main": "main.js"
}

2.main.js

复制代码
var electron = require('electron');
var app = electron.app;
var BrowserWindow = electron.BrowserWindow;
var ipc = electron.ipc;


var mainWindow = null;

app.on('window-all-closed', function () {
    if (process.platform != 'darwin') {
        app.quit();
    }
});

app.on('ready', function () {
    // 创建浏览器窗口。
    mainWindow = new BrowserWindow({ width: 800, height: 600 });

    // 加载应用的 index.html
    mainWindow.loadURL('file://' + __dirname + '/index.html');

    // 打开开发工具
    mainWindow.openDevTools();

    // 当 window 被关闭,这个事件会被发出
    mainWindow.on('closed', function () {
        // 取消引用 window 对象,如果你的应用支持多窗口的话,
        // 通常会把多个 window 对象存放在一个数组里面,
        // 但这次不是。
        mainWindow = null;
    });

    mainWindow.webContents.openDevTools()
});
复制代码

3.index.html

复制代码
<!DOCTYPE html>
<html>

<head>
    <title>Hello World!</title>
</head>

<body>
    <script>
        var alertOnlineStatus = function () {
            //window.alert(navigator.onLine ? 'online' : 'offline');
            ipc.send('online-status-changed', navigator.onLine ? 'online' : 'offline');
        };

        window.addEventListener('online', alertOnlineStatus);
        window.addEventListener('offline', alertOnlineStatus);

        alertOnlineStatus();
    </script>
    <h1>Hello World!</h1>
    We are using io.js111
    <script>document.write(process.version)</script>
    and Electron
    <script>document.write(process.versions['electron'])</script>.
</body>

</html>
复制代码

4.launch.json  

复制代码
{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Electron Main",
            "cwd": "${workspaceRoot}",
            "runtimeExecutable": "/home/rox/.nvm/versions/node/v10.15.1/bin/electron",
            "windows": {
                "runtimeExecutable": "/home/rox/.nvm/versions/node/v10.15.1/bin/electron.cmd"
              },
            "args" : ["."],
            "outputCapture": "std"
            //"program": "${workspaceFolder}/main.js"
        }
    ]
}
复制代码

5.在js文件中设置断点  使用Electron Main 项调试

 

posted @   高_山_流_水  阅读(3445)  评论(0编辑  收藏  举报
编辑推荐:
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
阅读排行:
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· Docker 太简单,K8s 太复杂?w7panel 让容器管理更轻松!
点击右上角即可分享
微信分享提示