Electron add resource file on package - electron

I am building my first electron app, but I cant package it.
When I am testing using npm start everything works but when I tried to package it and when it done, I run it, but I am getting something like this ENOENT: no such file or directory, lstat.
I have some source like this.
fs.copy(path.resolve('src/app/resource/'), dir + '/resource/', e => {
if (e) {
reject(e);
return;
}
resolve(true);
});
That will copy files to the specified directory and it seem this is the cause of the error.
Edit:
I enable the devtools and create installer for windows, but just got this.
It seems my files is not included on the build.
this is my package.json
{
"name": "exporter",
"productName": "Exporter",
"version": "0.0.1",
"description": "",
"license": "MIT",
"repository": "",
"author": {
"name": "",
"email": "",
"url": "none"
},
"scripts": {
"start": "electron .",
"build": "electron-packager . --out=/mnt/Busy\\ Drive/dist/exporter --asar --overwrite --all",
"pack": "build --dir",
"dist": "build -wl"
},
"dependencies": {
"bootstrap": "^4.0.0-beta",
"config": "^1.28.1",
"electron-debug": "^1.0.0",
"fs-extra": "^4.0.2",
"is-electron-renderer": "^2.0.1",
"jquery": "^3.2.1",
"mysql": "^2.15.0",
"popper.js": "^1.13.0",
"winston": "^2.4.0"
},
"devDependencies": {
"devtron": "^1.1.0",
"electron": "^1.8.1",
"electron-builder": "^19.47.1",
"electron-builder-squirrel-windows": "^19.47.0",
"electron-packager": "^8.0.0",
"eslint": "^4.11.0",
"eslint-plugin-import": "^2.8.0",
"eslint-plugin-node": "^5.2.1",
"eslint-plugin-promise": "^3.6.0",
"eslint-plugin-standard": "^3.0.1"
},
"build": {
"appId": "no-id",
"linux": {
"target": [
"dir"
]
},
"win": {
"target": "nsis"
}
}
}
I already tried different packager but still without success.
Is there wrong on my package.json?

The culprit is using the path.resolve, you should usepath.join(__dirname, 'your/path/here'), so it can access the asar file.

Related

How to build window electron executable program with babel

Actually I can build to use electron --trace-warnings -r #babel/register . and with #babel
electron-builder --windows nsis:ia32 command is success as a result
but i execute that, it occur error.
A JavaScript eror occured in the main process
C:\dev\electron\SomeDirectoryPath123123\index.js:1
import {app, BrowserWindow} from "electron";
^^^^^^^^
SyntaxError: Cannot use import statement outside a module
at Object.compileFuntion (node:vm:352:18)
at wrapSafe (node:internal/modules/cjs/loader:1039:15)
...etc...
please help me..
.babelrc
{
"presets": ["#babel/preset-env"]
}
package.json
{
"name": "test app",
"version": "1.0.0",
"description": "helpp me",
"main": "index.js",
"scripts": {
"manual-run": "electron --trace-warnings -r #babel/register .",
"build-package": "electron-builder --windows nsis:ia32"
},
"author": "nother",
"license": "ISC",
"devDependencies": {
"#babel/cli": "^7.17.10",
"#babel/core": "^7.18.5",
"#babel/node": "^7.18.5",
"#babel/preset-env": "^7.18.2",
"#babel/register": "^7.17.7",
"electron": "^19.0.4",
"electron-builder": "^23.0.3"
},
"dependencies": {
"#babel/cli": "^7.17.10",
"#babel/core": "^7.18.5",
"#babel/node": "^7.18.5",
"#babel/preset-env": "^7.18.2",
"#babel/register": "^7.17.7",
"elasticsearch": "^16.7.3",
"express": "^4.18.1",
"mongodb": "^4.7.0",
"node-fetch": "^2.6.7",
"sqlite3": "^5.0.8"
},
"build": {
"appId": "test-electron-app",
"productName": "hello!",
"buildDependenciesFromSource": false,
"asar": true,
"files": [
"dist/**/*",
"package.json",
"index.js"
],
"win": {
"target": "nsis"
},
"nsis": {
"oneClick": false
},
"directories": {
"buildResources": "./build/",
"output": "./distout/"
}
}
}

Unable to use keytar in main.js of electron project

I keep getting this error:
error in ./node_modules/keytar/build/Release/keytar.node
Module parse failed: Unexpected character '�' (1:2)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)
# ./node_modules/keytar/lib/keytar.js 1:13-52
# ./src/background.js
# multi ./src/background.js
I have background.js set as the main electron file in package.json because I'm using vue/vuetify with it which uses a main.js file as well.
{
"name": "project",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"electron:build": "vue-cli-service electron:build",
"electron:serve": "vue-cli-service electron:serve",
"postinstall": "electron-builder install-app-deps",
"postuninstall": "electron-builder install-app-deps"
},
"main": "background.js", // <------------------ see right here
"dependencies": {
"axios": "^0.19.0",
"core-js": "^3.4.3",
"jwt-decode": "^2.2.0",
"keytar": "^5.0.0",
"request": "^2.88.0",
"vue": "^2.6.10",
"vue-router": "^3.1.3",
"vuetify": "^2.1.0",
"vuex": "^3.1.2"
},
"devDependencies": {
"#vue/cli-plugin-babel": "^4.1.0",
"#vue/cli-plugin-eslint": "^4.1.0",
"#vue/cli-service": "^4.1.0",
"babel-eslint": "^10.0.3",
"electron": "^7.1.3",
"eslint": "^5.16.0",
"eslint-plugin-vue": "^5.0.0",
"node-loader": "^0.6.0",
"sass": "^1.19.0",
"sass-loader": "^8.0.0",
"vue-cli-plugin-electron-builder": "^1.4.3",
"vue-cli-plugin-vuetify": "^2.0.2",
"vue-template-compiler": "^2.6.10",
"vuetify-loader": "^1.3.0"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"rules": {},
"parserOptions": {
"parser": "babel-eslint"
}
},
"browserslist": [
"> 1%",
"last 2 versions"
]
}
Searching, it seems this happens when keytar is used in a renderer process. But background.js isn't a renderer process. Or am I missing something? I am completely new to electron.
I needed to mark keytar as external (as mentioned at https://nklayman.github.io/vue-cli-plugin-electron-builder/guide/guide.html#native-modules)
// vue.config.js
module.exports = {
pluginOptions: {
electronBuilder: {
// List native deps here if they don't work
externals: ['keytar']
}
}
}
Once I did that it worked properly.
Run appropriate loader (source).
yarn add node-loader -D
// vue.config.js
configureWebpack: {
devtool: 'source-map',
module: {
rules: [
{ test: /\.node$/, loader: 'node-loader' }
]
}
}

error showing while creating a debian file from electronjs project

I am getting the below error while making deb file of electronjs
Error: could not find the Electron app binary at "dist/app-linux-x64/koriwallet". You may need to re-bundle the app using Electron Packager's "executableName" option.
My package.json file is
{
"name": "wallet",
"version": "1.0.0",
"description": "wallet",
"main": "src/main.js",
"scripts": {
"start": "electron .",
"build": "electron-packager . myapp",
"pack": "electron-builder --dir",
"dist": "electron-builder",
"deb64": "electron-installer-debian --src dist/app-linux-x64/ --dest dist/installers/ --arch amd64"
},
"author": "wallet",
"license": "ISC",
"devDependencies": {
"asar": "^2.0.1",
"electron": "^5.0.6",
"electron-builder": "^21.1.1",
"electron-installer-debian": "^2.0.0",
"electron-packager": "^14.0.2"
},
"electronPackagerConfig": {
"packageManager": "npm",
"executableName": "kori"
},
"build": {
"appId": "wallet",
"linux": {
"category": "wallet"
}
},
"dependencies": {
"cookies": "^0.7.3",
"crypto": "^1.0.1",
"dpkg": "^1.0.0",
"jquery": "^3.4.1",
"jstorage": "^0.4.8"
}
}
My 2 cents. I'm making an Fedora 30 rpm and got:
An unhandled error has occurred inside Forge:
An error occured while making for target: rpm
could not find the Electron app binary at "/home/ajm/Documents/Projects/sunstealer.ets/out/sunstealer.ets product-linux-x64/sunstealer.ets". You may need to re-bundle the app using Electron Packager's "executableName" option.
Error: could not find the Electron app binary at "/home/ajm/Documents/Projects/sunstealer.ets/out/sunstealer.ets product-linux-x64/sunstealer.ets". You may need to re-bundle the app using Electron Packager's "executableName" option.
at error.wrapError (/home/ajm/Documents/Projects/sunstealer.ets/node_modules/electron-installer-common/src/installer.js:145:15)
Fix was update package.json from
"name": "sunstealer.ets",
"productName": "sunstealer.ets product",
to:
"name": "sunstealer.ets",
"productName": "sunstealer.ets",
i.e. same value. Then npm run make with:
"forge": {
"packagerConfig": {},
"makers": [
{
"name": "#electron-forge/maker-squirrel",
"config": {
"certificateFile": "./certs/adam_mauger.pfx",
"certificatePassword": "REDACTED"
}
},
{
"name": "#electron-forge/maker-dmg",
"config": {
"format": "ULFO"
}
},
{
"name": "#electron-forge/maker-rpm",
"config": {
}
},
created sunstealer.ets-1.0.0-1.x86_64.rpm. Hope that helps.
my 5 cents)
so, launch npm from root folder. there exist node_modules.
app stored in root/src. there exist node_modules.
and in root and in root/src have package.json
check root/src/package.json file. maybe there parameter "name" have default value in lowercase

Zapier validate method returns error

. This is the error I get when I run "zapier validate" command. My package.json file has this code :
"name": "github-example-app",
"version": "1.0.0",
"description": "An example app for the Zapier platform.",
"repository": "zapier/zapier-platform-app-github-example",
"homepage": "https://zapier.com/developer",
"author": "Zane Lyon <zane.lyon#zapier.com>",
"license": "BSD-3-Clause",
"main": "index.js",
"scripts": {
"test": "node node_modules/mocha/bin/mocha --recursive"
},
"engines": {
"node": "8.10.0",
"npm": ">=5.6.0"
},
"dependencies": {
"zapier-platform-core": "^7.0.0"
},
"devDependencies": {
"mocha": "^5.2.0",
"should": "^13.2.0"
}
and here is the package-lock.json code which shows the zapier-platform-core details:
"zapier-platform-core": {
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/zapier-platform-core/-/zapier-platform-core-7.0.0.tgz",
"integrity": "sha512-8nJ9xs6Dig1/Hvvpcz3upD0lnPd/gg5YCpum2S5xLnsV5yuQXUcEIXuQq7T5PPksmQgO3ux57szN4EU2+q9RvA==",
"requires": {
"bluebird": "3.5.0",
"content-disposition": "0.5.2",
"dotenv": "5.0.1",
"form-data": "2.2.0",
"lodash": "4.17.10",
"node-fetch": "1.7.1",
"zapier-platform-schema": "7.0.0"
}
},
I tried changing the package.json code as
"dependencies": {
"zapier-platform-core": "^7.0.0"
},
to
"dependencies": {
"zapier-platform-core": "7.0.0"
},
after this I get the error
What must I do to resolve this ? This code was running fine two days back. What might have happened to cause this error?
David here, from the Zapier Platform team.
That error comes from here and pops up when we can't find zapier-platform-core in node_modules.
It seems like it should be there given what you posted. with "zapier-platform-core": "7.0.0" in your package.json, run rm -rf node_modules && npm i to make sure everything is fresh.
If that doesn't work, please open an issue at https://github.com/zapier/zapier-platform-cli/issues/new.

Electron app window does not gain focus when distributed for Mac

This a strange one for me. I have an Electron app which works fine when I run it locally. However, when I npm run dist it to create a native version, the resulting app fails to take focus when I click on it. I click on the text field in the window and a flashing cursor shows up however, when I type keystrokes, they go to the window I was in before (e.g. Finder). This only happens in Mac (Windows works fine) when I'm using a packaged version.
Very perplexing stuff :)
My package.json looks like this (sanitised some names and URLs):
{
"name": "Myapp",
"productName": "MyApp",
"version": "0.0.44",
"description": "MyApp",
"license": "",
"repository": "",
"main": "./main.js",
"author": {
"name": "MyApp Ltd.",
"email": "c#c.com",
"url": "www.c.com"
},
"engines": {
"node": ">=4"
},
"electronVersion": "1.8.3",
"scripts": {
"test": "mocha",
"start": "electron .",
"pack": "build --dir",
"dist": "build"
},
"build": {
"appId": "MyApp",
"win": {
"target": "squirrel",
"icon": "assets/icons/Windows_Icon.ico"
},
"squirrelWindows": {
"loadingGif": "assets/img/installing.gif",
"iconUrl": "https:/fake-url.com/icon.ico",
"msi": false
},
"dmg": {
"window": {
"x": 200,
"y": 200,
"width": 537,
"height": 374
},
"icon": "assets/icons/Mac_Icon.icns",
"background": "assets/img/dmg-background.png"
},
"mac": {
"icon": "assets/icons/Mac_Icon.icns",
"extendInfo": {
"LSBackgroundOnly": 1
}
}
},
"dependencies": {
"azure-event-hubs": "0.0.4",
"babel-polyfill": "^6.20.0",
"bootstrap": "^3.3.7",
"chokidar": "^1.6.1",
"download": "^5.0.2",
"electron-debug": "^0.3.0",
"electron-is-dev": "^0.3.0",
"electron-json-storage": "^3.0.4",
"electron-log": "^2.2.6",
"electron-positioner": "^3.0.0",
"electron-squirrel-startup": "^1.0.0",
"follow-redirects": "^1.2.3",
"glob": "^7.1.1",
"howler": "^2.0.3",
"jquery": "^3.2.1",
"nan": "^2.1.0",
"nconf": "^0.7.2",
"node-schedule": "^1.2.5",
"opener": "^1.4.3",
"pusher-js": "^4.1.0",
"sqlite3": "^3.1.8",
"unirest": "^0.5.1"
},
"devDependencies": {
"chai": "^4.0.2",
"chai-as-promised": "^6.0.0",
"electron": "^1.8.3",
"electron-builder": "^20.8.0",
"electron-builder-squirrel-windows": "^20.9.0",
"electron-installer-dmg": "^0.2.1",
"electron-packager": "^5.1.1",
"mocha": "^3.2.0",
"spectron": "^3.0.0",
"xo": "^0.10.0"
},
"xo": {
"esnext": true,
"envs": [
"node",
"browser"
]
}
}
The LSBackgroundOnly option in Mac apparently has this effect because it designates the app a background app and presumably no events are delivered to it. Once I set it to false, the issue was resolved.

Resources