Electron-builder doesnt generate dist files - electron

I'm trying to build an installer with electron-builder but every time I generate the installer and install my application, I get an error that "dist/index" doesn't exist in .asar file. I checked and no dist file is packed inside .asar.
The error I'm getting:
Not allowed to load local resource: file:///C:/Users/user1/AppData/Local/Programs/myApp/resources/app.asar/dist/index.html
I'm building with this script:
"publish": "set GH_TOKEN=<my_token> && electron-builder --win -p always"
Does electron-builder have any flags to tell him where to put the output files?

Okey after some trial and error, I found what was wrong...
So basically my package.json was configured wrong. In order to include dist in build it must be specified like this:
...
"build": {
"appId": "si.app.testing",
...
"directories": {
"output": "release",
"buildResources": "dist"
},
"files": [
"**/*",
"dist/**/*",
...
"!.github",
"!.vs",
"!node_modules/*"
]
},
...

Related

Build electron as exe on macbook m1

I trying to build an electron with an exe installer on macOS with a MacBook Pro with an m1. I already tried different packages like electron-packager, electron-forge, but unfortunately, none of my tries worked. Did anyone has a solution to build an electron version with an exe on macOS.
My latest approach looked like, but when I start and after more then 30 minute it still do no finish.
yarn run electron-forge make --arch=x64 --platform=win32
The current code could be found here.
We using electron-builder for packaging electron app on Windows&MacOS(x86_x64/arm etc.), and you can try it.
add some config in package.json, like this:
"build": {
"appId": "com.electron.yourappid",
"productName": "your-product-name",
"asar": false,
"mac": {
"target": [
"pkg"
],
"entitlements": "entitlements.mac.plist"
},
"win": {
"target": [
{
"target": "zip",
"arch": [
"x64"
]
},
{
"target": "msi",
"arch": [
"x64"
]
}
]
}
},
"scripts": {
"dist": "electron-builder"
},
then run npm command like this:
# add package in your project
npm install --save-dev electron-builder
npm run dist # or 'npx electron-builder'
If you perfer using 'shelljs', create a file 'dist.js', and content:
const { exec, rm } = require('shelljs');
exec('electron-builder');
and then run node command
npm install --save-dev shelljs
node dist.js
More detail for config you can read offical doc of electron-builder.
I've looked into it and failed (building Apple Silicon, Apple Intel and Windows distributables from M1 Mac). I ended up setting up VMs that I use for building the distributables, and testing also.
electron-builder 23.0.3 and flag --universal work for me on Macbook M1 2021
This works for me. npx electron-builder --win --x64

Electron-forge package generates an empty out folder

I am working on app with electron and electron-forge, this app is being built on a virtual machine with no internet connection, so I got electron binaries files, and set the electron_config_cache to the path where I located the new binaries as well as for cacheRoot for packagerConfig in the package.json file, the problem is that:
When I run yarn package (electron-forge package) I am getting Done with green check next to each step which had been called by yarn package .. but the out folder is empty, while it should has appName-win32-x64 folder which contains .exe.
so does anyone have an idea regarding this?
Be sure that your package.json has the correct settings, including the "main" attribute as well as build directories. It seems electron forge uses electron-packager as its packaging platform so:
Following these instructions:
From Electron forge,Electron forge - packager options, Electron-packager options
Without a forge.config.js file:
Add this to your package.json:
"config": {
"forge": {
"packagerConfig": {dir:"./path/to/your/dir"},
"makers": [
{
"name": "#electron-forge/maker-zip"
}
]
}
Or with a forge.config.js file:
In your package.json, make sure to have:
{
"name": "my-app",
"version": "0.0.1",
"config": {
"forge": "./forge.config.js"
}
}
In your forge.config.js:
{
packagerConfig: {dir:"./path/to/your/dir"},
electronRebuildConfig: { ... },
makers: [ ... ],
publishers: [ ... ],
plugins: [ ... ],
hooks: { ... },
buildIdentifier: 'my-build'
}
I think it is most probable that forge is just not pointed to the correct dir, add the dir setting shown above.
The problem was a virtual machine problem, nothing related to electron forge itself, the VM was not able to copy the content from the temp folder to the out folder, this can be solved by changing the temp folder

Execute an exe(Inside Project structure) in Electron

While in developing mode, executing the exe is working well.
My code to launch the exe is
function LaunchExe() {
var child = require('child_process').execFile;
var executablePath = 'DemoExe/Sample.exe';
var parameters = ['Hai', 'Test', 'Dat'];
child(executablePath, parameters, function (err, data) {
console.log(err)
console.log(data.toString());
});
}
But after packaging the Electron app, I can't launch the exe.
The command I use to build the exe is
electron-packager . --asar
Error code
Error: spawn DemoExe/Sample.exe ENOENT
at Process.ChildProcess._handle.onexit (internal/child_process.js:232)
at onErrorNT (internal/child_process.js:407)
at process._tickCallback (internal/process/next_tick.js:63)
Regards.
Is your project with angular?
Maybe this can help, but I had problems too with electron-packager.
So I suggest you to use electron builder : https://www.electron.build
Fist you need to add a file at root called electron-builder.json and it shoul'd contain the following (you need to update productname and icons location):
{
"productName": "projectname",
"appId": "org.project.projectname",
"artifactName": "${productName}-setup-${version}.${ext}",
"directories": {
"output": "builds/"
},
"files": [
"dist/",
"node_modules/",
"package.json",
"**/*",
"!**/*.ts",
"!*.code-workspace",
"!package-lock.json",
"!src/",
"!e2e/",
"!hooks/",
"!angular.json",
"!_config.yml",
"!karma.conf.js",
"!tsconfig.json",
"!tslint.json"
],
"nsis": {
"oneClick": false,
"allowToChangeInstallationDirectory": true
},
"mac": {
"icon": "src/favicon.ico"
},
"win": {
"icon": "src/favicon.ico"
},
"linux": {
"icon": "src/favicon.png"
}
}
Then, you need to add those scripts to your package.json
"scripts": {
"build:prod": "npm run build -- -c production",
"package:windows": "npm run build:prod && electron-builder build --windows"
}
can compile the executable with
npm run package:windows
Also, don't forget to add electron builder into your dev dependencies :
yarn add electron-builder --dev
the executable with be located into /builds
Got to work with following steps,
1.package the Electron app using command
electron-packager .
2.Path to exe
path.join(__dirname, "DemoExe", "Sample.exe")

electron-forge how to specify a source directory for packaging?

I've rigged create-react-app with the electron-forge app and now I need to somehow specify the build folder produced from the CRA for the packaging. That folder should also be served.
Would such a thing be possible with electron-forge?
I understand are you asking how to tell electron-forge which directory to find your source files in for packaging the app.
If so, see: https://github.com/electron-userland/electron-packager/blob/master/docs/api.md
where it describes the options of the
"config": {
"forge": {
object in your package.json file
inside they there is this package config object:
"electronPackagerConfig": {
"dir": "./src",
where you can specify your source folder.
Also, BTW: there you can specify files/file-regexs to be ignored in packaging:
"ignore": [".idea", ".gitignore"]
electron-forge has no option to specify input folder (project's root folder will be used):
Specify ignore option to skip folders/files;
Use main key in
package.json to specify correct start script.
For example, package.json for vue project:
{
"name": "project",
"version": "1.0.0",
"main": "index.js",
...
"config": {
"forge": {
"packagerConfig": {
"ignore": [
"^/[.]vs$",
"^/public$",
"^/src$",
"^/[.]browserslistrc$",
"^/[.]editorconfig$",
"^/tsconfig[.]json$",
"[.](cmd|user|DotSettings|njsproj|sln)$"
]
},
...
}
},
...
}

Electron-builder release tries to publish to Github and complains about GH_Token

running the release script without publish option tries to publish the build to GitHub ( and fails while complaining about not being able to find GHToken! )
Error: GitHub Personal Access Token is not set, neither programmatically, nor using env "GH_TOKEN"
Setting "publish": "never" will fail also complaining about not being able to find module electron-publisher-never!
Error: Cannot find module 'electron-publisher-never'
It all happens while the project is built but build scripts exits non-zero!
I'm using the latest version of electron-builder.
my build script:
"build": {
"appId": "eu.armand.[****]",
"copyright": "Copyright © 2017 mim_Armand",
"productName": "[****]",
"mac": {
"publish": "never",
"category": "public.app-category.[****]",
"icon": "assets/icons/mac/icon.icns"
}
Any idea what's going on or if I'm doing it wrong?!
,m
try building with
"build": "electron-builder --publish never"
to never publish.
rename your script to something else.
if the script name is release → publish is set to always
the documentation states this:
CLI --publish option values:
...
If npm script named release, — always.
Add to scripts in the development package.json:
"release": "build"
and if you run yarn release, a release will be drafted (if doesn’t
already exist) and artifacts published.
I solved it this way, because I didn't need to put it in any repository
"build":{
"appId": "XXX",
"productName": "XXX",
"directories":{
"output": "build"
},
"win":{
"target": "nsis",
"publish" : []
}
}
https://www.electron.build/configuration/publish

Resources