4

I've been trying to package an electron app but it never goes past this stage:

enter image description here

I've tried 3 times and every time it takes hours but doesn't finish packaging for squirrel.

package.json:

{
  "name": "NAME",
  "version": "0.1.0",
  "private": false,
  "author": "AUTHOR",
  "description": "DESCRIPTION.",
  "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-compile": "^6.4.4",
    "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"
  },
  "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-prebuilt-compile": "8.2.0",
    "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": {}
        }
      ]
    }
  }
}

An application file appears in my out > win32-x64 folder but it's not an .exe file.

I also have a random out > make > squirrel.windows > x64 folder that doesn't have anything in it.

Arkellys
  • 5,562
  • 2
  • 16
  • 40
vel
  • 81
  • 7

1 Answers1

3

The process takes forever because you're packaging your whole app, node_modules included.

A quick solution is to add the parameter "asar": true to you packagerConfig1. But unless you want to package the non-compiled files, you probably only want to keep the build folder.

You already configured your scripts to run a build before the make. Now, since Electron Forge doesn't give the option to override dir2, you will have to use the ignore option to exclude the files and folders you don't want to have in the packaged app3.

packagerConfig: {
    ignore: [
        "^\\/public$",
        "^\\/src$",
        "^\\/node_modules$",
        "^\\/[.].+",
        // [...]
    ]
},

1. For the record, I found mentions of this here, here and here.
2. As stated in the documentation → "Please note that you can not override the dir, arch, platform, out or electronVersion options as they are set by Electron Forge internally"
3. See another example with this answer.

Arkellys
  • 5,562
  • 2
  • 16
  • 40
  • 1
    If you specify your electron-forge configuration in a Javascript file ([see docs](https://www.electronforge.io/configuration)), you can also provide a function for the ignore filter ([see docs](https://electron.github.io/electron-packager/main/interfaces/electronpackager.options.html#ignore)). This is a lot more flexible than a list of regex patterns; you can implement the ignore function to act as a whitelist of folders to include rather than a blacklist of folders to exclude – mark.monteiro Sep 08 '22 at 21:52