带有Vite/Vue的电子模块的ES6导入失败
带有Vite/Vue的电子模块的ES6导入失败
提问于 2021-11-01 13:14:03
我正在尝试在最新的Vite 2/Vue 3中使用电子。我已经安装了两个版本的电子主文件，这样我就可以测试和使用dev服务器和构建：
加载localhost:3000 (来自npm )的loadURL
- another版本，从loadFile
的dist文件夹加载构建的版本(来自npm运行生成)
我已经设置了新的BrowserWindow选项：
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
enableRemoteModule: true,
preload: path.join(app.getAppPath(), 'electron.preload.js')
}在开发和构建版本中，该应用程序的电子启动都很好，加载所有资产，并且没有任何安全错误。但是，当我试图在我的项目中从“电子”导入任何模块时，例如：
import electron from 'electron';我知道错误：
Uncaught TypeError: path.join is not a function
at node_modules/electron/index.js (index.js:4)我试着检查path和__dirname，看看它们是否适用于我的项目：
import * as path from 'path';
console.log(path);
console.log(path.join);
console.log(__dirname);它们在电子显像板中追踪到了以下几点：
如果我尝试不同地导入路径：
import path from 'path'
console.log(path);
console.log(path.join);我得到以下结果：
无论如何，path.join是未定义的。现在我几乎被困在如何继续下去的问题上。
我还可以补充说，我想使用fs--额外的，但这也失败了：
import fs from 'fs-extra';
编辑:在webPreferences中添加预加载
回答 1
Stack Overflow用户
发布于 2022-04-17 08:34:20
我相信Vite在幕后改变了很多事情。谢天谢地，@electron/remote提供了另一种获取东西的方法：
electron.js
const { app, BrowserWindow } = require("electron");
const Remote = require("@electron/remote/main");
Remote.initialize();
// ...
app.on("ready", () => {
mainWindow = new BrowserWindow({
webPreferences: {
nodeIntegration: true,
enableRemoteModule: true,
contextIsolation: false,
},
});
Remote.enable(mainWindow.webContents);
mainWindow.loadFile(path.resolve("./dist", "index.html"));
});
// ...Component.tsx
import type { BrowserWindow } from "electron";
const Component: React.FC = () => {
const app = window.require("@electron/remote");
const win: BrowserWindow = app.getCurrentWindow();
// ...
}不确定这是否是最好的解决方案，但它适用于我的Vite +电子+反应。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/69797449
复制相关文章
相似问题
腾讯云开发者
