电子、反应和包裹应用

Question

我目前正在尝试将我的电子应用程序编译为mac的dist。 我正在使用这里找到的样板 https://github.com/kumarryogeshh/electron-react-parcel-boilerplate

目前正在尝试模块化代码的某些部分，特别是查看事物的电子方面。因此，目的是具有以下结构。

- src 
- components 
- electron_components 
window.js 
electron.js 
App.js 
custom.css 
index.js 

我的应用程序将有多个窗口，因此拥有windows.js类是有意义的，请参见下文：

const electron = require('electron');
const { BrowserWindow } = electron;
const isDev = require("electron-is-dev");
class Window extends BrowserWindow {
constructor(urldev, urlLive, height, width, resizable = true, parent = null, modal = false) {
super({
height: height,
width: width,
frame: true,
resizable: resizable,
show: true,
parent: parent,
modal: modal,
webPreferences: {
//allows application to run in the background
backgroundThrottling: true,
nodeIntegration: true
}
});
let promise = this.loadURL(
isDev
? urldev
: `file://${path.join(__dirname, urlLive)}`
);
}
}
module.exports = Window;

electron.js文件如下：

const electron = require("electron");
const app = electron.app;
const path = require("path");
const window = require(path.join(__dirname, './electron_components/window'))
let mainWindow;
function createWindow() {
mainWindow = new window('http://localhost:3000', "./build/index.html", 800, 600)
mainWindow.on("closed", () => (mainWindow = null));
}
app.on("ready", createWindow);
app.on("window-all-closed", () => {
if (process.platform !== "darwin") {
app.quit();
}
});
app.on("activate", () => {
if (mainWindow === null) {
createWindow();
}
});

因此，当我通过命令运行应用程序时yarn start它会运行并工作。这是因为它是开发环境。 但是，当我构建 dist 时，通过运行yarn build它会出现以下错误：

Uncaught Exception:
Error: Cannot find module '/Volumes/electron-react-parcel 1.0.0 1/electron-react-parcel.app/Contents/Resources/app.asar/src/electron_components/window'
Require stack:
- /Volumes/electron-react-parcel 1.0.0 1/electron-react-parcel.app/Contents/Resources/app.asar/src/electron.js
- 
at Module._resolveFilename (internal/modules/cjs/loader.js:797:17)
at Function../lib/common/reset-search-paths.ts.Module._resolveFilename (electron/js2c/browser_init.js:7736:16)
at Module._load (internal/modules/cjs/loader.js:690:27)
at Module._load (electron/js2c/asar.js:738:28)
at Function.Module._load (electron/js2c/asar.js:738:28)
at Module.require (internal/modules/cjs/loader.js:852:19)
at require (internal/modules/cjs/helpers.js:74:18)
at Object.<anonymous> (/Volumes/electron-react-parcel 1.0.0 1/electron-react-parcel.app/Contents/Resources/app.asar/src/electron.js:5:16)
at Module._compile (internal/modules/cjs/loader.js:967:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1004:10)

显然，组件导入出了问题，因此可以安全地假设electron.js文件顶部window class的导入语句不正确。我不确定我哪里出错了，但你的帮助会很棒。

谢谢

Answer 1

所以我选择改用使用电子锻造的不同样板。虽然没有回答原来的问题。它纠正了我的问题。