Electron-builder показывает пустое окно после сборки проекта

Question

После сброки с помощью npm run dist, когда я запускал сгенерированный exe-файл, он показывал только пустой экран. Потом я решил поместить какой-либо текст перед моим приложением и посмотреть, заключается ли проблема в неправильно указанном пути к index.html или в чем-то еще. После упаковки он показывает часть 'Hello World!' и, по какой-то причине, не загружает app.js.

Никаких ошибок в процессе сборки не появляется.

Когда я запускаю с помощью npm start, все работает нормально. Я думаю, что проблема либо в dependencies, либо в настройках electron-builder в package.json. Надеюсь кто-нибудь сможет помочь мне

Структура проекта

index.html

<!DOCTYPE html>
<html lang="ru">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
  </head>
  <body>
  <h1>Hello World!</h1>
    <div id="root"></div>
    <script src="build/js/app.js"></script>
  </body>
</html>

package.json

{
  "name": "stbc",
  "version": "1.0.0",
  "description": "",
  "main": "main.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "electron .",
    "watch": "webpack --config webpack.common.js --watch",
    "dist": "electron-builder"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "electron": "^20.2.0",
    "@babel/core": "^7.19.1",
    "@babel/preset-env": "^7.19.1",
    "@babel/preset-react": "^7.18.6",
    "babel-loader": "^8.2.5",
    "css-loader": "^6.7.1",
    "electron-builder": "^23.3.3",
    "sass": "^1.55.0",
    "sass-loader": "^13.0.2",
    "style-loader": "^3.3.1",
    "webpack": "^5.74.0",
    "webpack-cli": "^4.10.0"
  },
  "build": {
    "appId": "com.STB.C",
    "productName": "СТБК",
    "target": "NSIS",
    "nsis": {
      "allowToChangeInstallationDirectory": true,
      "oneClick": false
    },
    "icon": "/img/icon.png"
  }
}

main.js

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

function createWindow(){
    var BrowserWindow = require('electron').BrowserWindow
    const win = new BrowserWindow({
        width: 550,
        height: 652,
        backgroundColor: "darkgrey",
        webPreferences:{
            nodeIntegration: false,
            worldSafeExecuteJavaScript: true,
            contextIsolated: true
        },
        icon: __dirname + "/img/icon.png",
        useContentSize: true,
        autoHideMenuBar: true
    })

    win.loadURL(url.format({
        pathname: path.join(__dirname, '/index.html'),
        protocol: 'file:',
        slashes: true
    }));
}

app.on('closed', ()=> win = null);

app.on("ready",createWindow);

app.on('window-all-closed', app.quit)

БЛОГ НА HUSL

Electron-builder показывает пустое окно после сборки проекта

index.html

package.json

main.js

Ответы (0 шт):