[英]Electron package app opens on white screen, no errors
我最近剛剛打包了我的 electron 應用程序,但是當我嘗試運行它時,我只看到一個沒有錯誤或任何錯誤的空白屏幕。
我注意到的是,當我將開發人員工具和 go 切換到源 > 頁面時,顯示如下:
但是當我作為開發人員運行該應用程序時,我看到:
我不知道這是否與我的應用程序無法正常運行有關。
另外,我正在使用本教程嵌入的 ReactJS 編寫我的應用程序: https://blog.codemagic.io/building-electron-desktop-apps-with-react/#:~:text=What%20is%20Electron%3F ,構建%20desktop%20applications%20with%20Electron 。
這是我的 electron.js:
const path = require('path');
const { app, BrowserWindow } = require('electron');
const isDev = require('electron-is-dev');
function createWindow() {
// Create the browser window.
const win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true,
},
icon: path.join(__dirname, '/icon.png')
});
// and load the index.html of the app.
// win.loadFile("index.html");
win.loadURL(
isDev
? 'http://localhost:3000'
: `file://${path.join(__dirname, '/index.html')}`
);
// Open the DevTools.
if (isDev) {
win.webContents.openDevTools({ mode: 'detach' });
}
}
// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.whenReady().then(createWindow);
// Quit when all windows are closed, except on macOS. There, it's common
// for applications and their menu bars to stay active until the user quits
// explicitly with Cmd + Q.
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
app.quit();
}
});
app.on('activate', () => {
if (BrowserWindow.getAllWindows().length === 0) {
createWindow();
}
});
package.json:
{
"name": "NAME",
"version": "0.1.0",
"private": false,
"dependencies": {
"@emotion/react": "^11.10.0",
"@emotion/styled": "^11.10.0",
"@fortawesome/fontawesome-svg-core": "^6.1.2",
"@fortawesome/free-brands-svg-icons": "^6.1.2",
"@fortawesome/free-solid-svg-icons": "^6.1.2",
"@fortawesome/react-fontawesome": "^0.2.0",
"@material-ui/core": "^4.12.4",
"@mui/material": "^5.9.2",
"@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^13.3.0",
"@testing-library/user-event": "^13.5.0",
"bootstrap": "^5.2.0",
"cross-env": "^7.0.3",
"electron": "^19.0.10",
"electron-forge": "^5.2.4",
"electron-is-dev": "^2.0.0",
"react": "^18.2.0",
"react-bootstrap": "^2.4.0",
"react-dom": "^18.2.0",
"react-dropdown": "^1.10.0",
"react-modal": "^3.15.1",
"react-scripts": "5.0.1",
"reactjs-popup": "^2.0.5",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"dev": "concurrently -k \"cross-env BROWSER=none npm start\" \"npm:electron\"",
"electron": "wait-on tcp:3000 && electron .",
"package": "react-scripts build && electron-forge package",
"make-mac": "react-scripts build && electron-forge make --platform darwin",
"make-linux": "react-scripts build && electron-forge make --platform linux",
"make": "react-scripts build && electron-forge make",
"pack": "build --dir",
"dist": "build"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"concurrently": "^7.3.0",
"electron": "^19.0.10",
"electron-builder": "^23.3.3",
"electron-packager": "^15.5.1",
"wait-on": "^6.0.1"
},
"main": "public/electron.js",
"homepage": "./",
"config": {
"forge": {
"packagerConfig": {},
"makers": [
{
"name": "@electron-forge/maker-squirrel",
"config": {
"name": "stock_trading_app"
}
},
{
"name": "@electron-forge/maker-zip",
"platforms": [
"darwin",
"linux",
"win32"
]
},
{
"name": "@electron-forge/maker-deb",
"config": {}
},
{
"name": "@electron-forge/maker-rpm",
"config": {}
}
]
}
}
}
文件結構:
讓我知道是否需要其他任何東西。
謝謝,
嘗試:
isDev ? win.loadURL('http://localhost:3000') : win.loadFile(path.join(__dirname, '/index.html'));
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.