首页 > 解决方案 > Electron Packager 生成空白页

问题描述

我是 Electron.js 的新手,不知道如何将应用程序打包到生产环境中。当我使用yarn start&yarn run electron我看到我在应用程序中所做的更改:

在此处输入图像描述

但在包装后npx electron-packager . --overwrite我什么也没看到:

在此处输入图像描述

我猜想 package.json 或 main.js 上的窗口路径有问题,但我尝试过的任何东西都没有修复它:

包.json

{
  "name": "team",
  "version": "0.1.0",
  "private": true,
  "main": "public/main.js",
  "dependencies": {
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "concurrently": "^6.2.1",
    "cross-env": "^7.0.3",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-scripts": "4.0.3",
    "web-vitals": "^1.0.1"
  },
  "scripts": {
    "start": "set BROWSER='none' && react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "electron": "electron ."
  },
  "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": {
    "electron-packager": "^15.4.0",
    "electron": "^14.0.1"
  }
}

main.js

const { app, BrowserWindow } = require('electron')

function createWindow () {
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    icon: './logo.ico',
    webPreferences: {
      nodeIntegration: true,
      // devTools: false
    }
  })
  //development: 
  //win.loadURL('http://localhost:3000');
  win.webContents.openDevTools();
  // production: 
  win.loadURL('index.html');
}

app.whenReady().then(createWindow)
app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})
app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow()
  }
})

__dirname我尝试添加此处建议的内容,但得到了相同的结果。

谢谢!

标签: reactjselectronelectron-packager

解决方案


推荐阅读