在Electron和Vue中加载预加载脚本

问题描述

我正在使用Vue CLI 3和 vue-cli-plugin-electron-builder 打包我的Vue Electron应用程序，但无法获得preload.js脚本来进行电子工作.

I am using Vue CLI 3 and vue-cli-plugin-electron-builder to package my Vue Electron app and I am not able to get my preload.js script for electron working.

主窗口

win = new BrowserWindow({
  width: 800,
  height: 600
  webPreferences: {
    nodeIntegration: false,
    preload: path.join(__dirname, "/../src/preload.js") // works but window.electron.dialog in undefined
  }
});

preload.js

const { dialog } = require("electron");

window.electron = {};
window.electron.dialog = dialog;

在我的Vue组件中始终未定义 window.electron.dialog -导入显然不起作用.请注意，正确定义了 window.electron .我一定很想念东西.

The window.electron.dialog is always undefined in my Vue component - the import is clearly not working. Note that window.electron is defined properly. I must be missing something.

推荐答案

将以下行添加到文件 vue.config.js 中，如果该文件不存在，请在以下文件的根文件夹中创建一个您的项目

Add the following lines into the file vue.config.js , if the file does not exist create one in the root folder of your project

module.exports = {
 //...
 pluginOptions: {
  electronBuilder: {
    preload: 'src/preload.js',
    // Or, for multiple preload files:
    // preload: { preload: 'src/preload.js', otherPreload: 'src/preload2.js' }
  }
 }
 //...
}

查看文档以了解更多信息#preload-files

Check the documentation for more #preload-files

这篇关于在Electron和Vue中加载预加载脚本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！