使用Electrol-Builder构建React-Electron应用程序，index.js加载在预标签中

Question

我有一个应用程序，我现在正试图建立分发测试。

我使用React和Electron与Electrol-Builder一起构建应用程序本身。我不是一个web开发人员，所以我一直试图保持基本的东西，只是得到一些工作。

function createWindow() {
    const startUrl = process.env.ELECTRON_START_URL || url.format({
        pathname: path.join(__dirname, '../src/index.js'),
        protocol: 'file:',
        slashes: true,
    });
    mainWindow = new BrowserWindow({
        width: 800, height: 600, title: "Electron App", webPreferences: {
            nodeIntegration: true
        }
    });
    mainWindow.loadURL(startUrl);
    mainWindow.on('closed', function () {
        mainWindow = null;
    });
}

 "scripts": {
    "start": "nf start -p 3000",
    "start-electron": "set ELECTRON_START_URL=http://localhost:3000 && electron .",
    "react-start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "build-electron": "npm run build && electron-builder build --win"
  }

这也是构建部分。老实说，我真的不明白这是什么或做了什么，但经过几个小时的尝试和错误，这就是让我达到现在的地步。

"build": {
"appId": "Test",
"extends": null,
"files": [
  "./build/**/*",
  "./electron/main.js",
  "./src/**/*"
 ]
}

就我所知，这与Electron start URL有关，因为当我从createWindow中的const startUrl中删除该URL时，使用npm start运行应用程序与构建的Electron应用程序所做的事情相同，而在使用npm之前，每次都将正常启动应用程序。

解决方案后编辑：

"build": {
    "appId": "Test",
    "extends": null,
    "files": [
      "./build/**/*",
      "./electron/main.js",
      "./src/**/*"
    ],
    "directories": {
      "buildResources": "./public"
    }
  }    

const startUrl = process.env.ELECTRON_START_URL || url.format({
        pathname: path.join(__dirname, '../build/index.html'),
        protocol: 'file:',
        slashes: true,
    });

Answer 1

您应该用html文件设置它。

    const startUrl = process.env.ELECTRON_START_URL || url.format({
        pathname: path.join(__dirname, '../src/index.html'),
        protocol: 'file:',
        slashes: true,
    });