如何從Electron上的預加載腳本中的渲染過程訪問jquery

Question

我在窗口中將Node集成配置為false，因為如文檔所述，禁用是一種很好的做法。

我想在預加載腳本中訪問渲染過程的jQuery，但是我不知道該怎么做。

在預加載腳本中發生某些事件之后，是否可以激活模式（例如）？

鏈接到我在Github中的示例代碼： https ： //github.com/JhonatanRSantos/Sample

Answer 1

正如Janith所說的，您不需要使用預加載腳本。 這是一個基於您的Github存儲庫的工作示例：

Index.html-在HEADER部分，像這樣修改：

<script>window.$ = window.jQuery = require('jquery');</script>
<script src="./node_modules/popper.js/dist/umd/popper.min.js"></script>
<script src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>

請注意，您必須使用路徑./node_modules/popper.js/dist/umd/popper.min.js否則您將在控制台中收到錯誤消息（請參閱引導程序4中的popper.js提供了SyntaxError意外令牌導出 ）

Index.html-頁腳，添加：

<script src="./index.js"></script>

將preload.js重命名為index.js

index.js可以是：

console.log('Preload.js');
setTimeout(() => {
    console.log('Open Boostrap Modal');
    $('#myModal').modal('show');
}, 5000);

最后，main.js可以是：

const { app, BrowserWindow } = require('electron');
const path = require('path')
const url = require('url')

let createWindow = () => {
    let win = new BrowserWindow({
        width: 800,
        height: 500,
        center: true,
        resizable: false,
        show: false
    });
    win.setMenu(null);
    const mainUrl = url.format({ // https://electronjs.org/docs/api/browser-window#winloadurlurl-options
        protocol: 'file',
        slashes: true,
        pathname: path.join(__dirname, 'index.html')
      })
    win.loadURL(mainUrl);
    win.once('ready-to-show', () => {
        win.show();
        win.webContents.openDevTools();
    });
    win.on('closed', () => {
        win = null;
    });
};
app.on('ready', createWindow);

我向您的回購請求請求以獲取更改。