vue.js - 如何在 quasar vue 组件环境中使用 require ('electron' )？

Question

如何从渲染器端模块(如在 Quasar 框架中运行的 vue 组件)中访问主 Electron 进程 fs 模块。

我在一个组件中尝试了一些变体，但出现以下错误:

const { app } = require('electron')

vue-router.esm.js?8c4f:1897 TypeError: fs.existsSync 不是函数

const { app } = window.require('electron')

类型错误:window.require 不是函数

在通过我的 friend 谷歌查看了我可以找到的内容之后，我仍在寻找关于如何从在 quasar 框架下运行的 vue 组件中访问 Electron 主进程功能的答案。任何人……任何人？我已经看到了一些文件浏览器的 github 示例，但根据 Electron 文档，似乎只是简单地调用类似 fs.readdirSync() 的实现应该比我在这些实现中看到的要简单得多。

Answer 1

Quasar 文档中解释了您的问题
https://quasar.dev/quasar-cli/developing-electron-apps/node-integration
Quasar 的建议是使用预加载脚本将渲染器进程中所需的节点 API(即:BrowserWindows)附加到全局窗口对象。
https://quasar.dev/quasar-cli/developing-electron-apps/electron-preload-script

将预加载脚本附加到 BrowserWindow(主进程)

src- Electron/Electron -main.js:

import path from 'path'
win = new BrowserWindow({
  ...
  webPreferences: {
    preload: path.resolve(__dirname, 'electron-preload.js')
  }
})

将节点 API 附加到全局窗口(预加载脚本)

src- Electron/Electron -preload.js:

window.electron = require('electron')

通过窗口全局(Renderer Process)使用Node API

一些文件.vue

window.electron.ipcRenderer.sendSync(
   'message',
   payload
)