Vue.js 如何将Electron API与Vue js组件一起使用？

我正在使用样板文件，我想在单击按钮后使我的

主窗口成为
全屏

Electron窗口API:Electron.atom.io/docs/API/browser-Window

HTML:

切换到全屏

Vue：

导出默认值{
名称：“主组件”，
方法：{
setFullScreen:函数（）{
mainWindow.setFullScreen（真）；
}
}

这不起作用。如何在Electron vue中使用Electron API

以及index.js：

“严格使用”
从“electron”导入{app，BrowserWindow}
让主窗口
const winURL=process.env.NODE_env==='development'
? `http://localhost:${require（'../../../config'）.port}`
：`file://${{uuuu dirname}/index.html`
函数createWindow（）{
/**
*初始窗口选项
*/
主窗口=新浏览器窗口({
身高：728，
宽度：1024，
全屏：假，
})
mainWindow.loadURL（winURL）
mainWindow.on（'关闭'，（）=>{
主窗口=空
})
//eslint禁用下一行无控制台
console.log（'主窗口已打开'）
}
应用程序打开（'ready'，createWindow）
app.on（'window-all-closed'，（）=>{
if（process.platform！=='darwin'）{
app.quit（）
}
})
app.on（'activate'，（）=>{
如果（主窗口===null）{
createWindow（）
}
})

您将在electron Vue中找到它

图中显示了文件夹的结构如何
主窗口
在Vue代码中不可用，因为它是在主进程中定义的

但是，在单文件组件中，您可以从electron导入
remote
，在那里您可以访问当前窗口

const {remote} = require("electron")

export default {
  name: 'mainComponent',
  methods: {
    setFullScreen: function() {
      remote.getCurrentWindow().setFullScreen(true);
    }
  }
}

您在哪里定义
mainWindow
？在index.js中，检查我是否已更新了问题！由于remote已被弃用，对此有什么替代方法？我知道我应该执行main.js，我应该添加
global.api.myFunc
。但是main.ts与vue的main.js不同。@worms可能是一种方法。我将自己测试一下具有相同的要求。但我正在使用vue cli插件electron builder。@Benargee我最后做了（简化）
//vue侧窗口。require（'electron'）.ipcRenderer.invoke（'loadFile'，filePath）；//background.js before createWindow（）从'electron'导入{ipcMain}；ipcMain.handle（'loadFile'，（u，filePath）=>require（'fs'））.promises.readFile（文件路径，'utf-8'））