Asking again 'cause I havent had any luck finding this information. Does anyone know where I can find the documentation or steps to package my Electron app for Windows on a Mac running OS Catalina(10.15)? I've successfully published for DMG and and .zip for Mac OS. Using electron-forge currently.
I read the Electron documentation to use wine or mono and I installed both, but I'm not sure what to do after that. I tried running the electron-packager after installing both but it still ignores the squirrel-maker for Windows. Tried running electron-make and publish, all ignore the squirrel-maker.
I got an error once that I needed to use 'electron-compile' but when I installed it and tried using it, it kept throwing an error on my source code when it would come across a dot operator for arrays or objects? Ex:
let object = {Name:"Something"}
let object2 = {Age:20}
let newObject = {
...object,
...object2
}
Would throw an error when trying to use the 'electron-compile' framework.
Really trying to avoid flipping back and forth between Windows and Mac on my mac and having to install electron on both platforms.
package.json file:
"name": "MyApp",
"productName": "My Fantastic App",
"version": "1.1.4",
"description": "The worlds most boring app.",
"main": "src/index.js",
"scripts": {
"start": "electron-forge start",
"package": "electron-forge package",
"make": "electron-forge make",
"publish": "electron-forge publish",
"lint": "echo \"No linting configured\"",
"dist": "build",
"build": "electron-builder build --dir"
},
"keywords": [],
"author": "sychordCoder",
"license": "MIT",
"config": {
"forge": "./custom-not.js"
},
"dependencies": {
"dotenv": "^9.0.2",
"electron-dl": "^3.2.1",
"electron-is-dev": "^2.0.0",
"electron-log": "^4.3.5",
"electron-squirrel-startup": "^1.0.0",
"electron-updater": "^4.3.9",
"firebase": "^8.6.2",
"jquery": "^3.6.0",
"pug": "^3.0.2"
},
"devDependencies": {
"#electron-forge/cli": "^6.0.0-beta.54",
"#electron-forge/maker-deb": "^6.0.0-beta.54",
"#electron-forge/maker-dmg": "^6.0.0-beta.54",
"#electron-forge/maker-rpm": "^6.0.0-beta.54",
"#electron-forge/maker-squirrel": "^6.0.0-beta.54",
"#electron-forge/maker-zip": "^6.0.0-beta.54",
"#electron-forge/publisher-github": "^6.0.0-beta.54",
"electron": "^12.0.0",
"uglify-js": "^3.13.7"
}
}
This is my config js file:
module.exports = {
packagerConfig: {
name: 'MyApp',
executableName: 'MyApp',
asar: true,
icon: 'src/images/icon128#2x',
ignore: ["file1source.js","file2source.js"],
appBundleId: 'MyAppId',
osxSign: {
identity: 'Developer ID Application: John Smith(90210)',
hardenedRuntime: true,
'gatekeeper-assess': false,
entitlements: 'static/entitlements.plist',
'entitlements-inherit': 'static/entitlements.plist',
'signature-flags': 'library'
},
osxNotarize: {
appleId: process.env.APPLE_ID,
appleIdPassword: process.env.APPLE_PASSWORD
}
},
makers: [
{
name: '#electron-forge/maker-squirrel',
platforms: [
"win32"
],
config: {
name: 'MyApp',
description: 'The worlds most boring app.',
version: '1.1.4'
}
},
{
name: '#electron-forge/maker-zip',
platforms: [
'darwin'
]
},
{
name: '#electron-forge/maker-deb',
config: {}
},
{
name: '#electron-forge/maker-rpm',
config: {}
},
{
name: '#electron-forge/maker-dmg',
config: {
overwrite:true,
icon: 'src/images/icon128#2x.icns'
}
}
],
publishers: [
{
name: '#electron-forge/publisher-github',
config: {
repository: {
owner: 'githubOwner',
name: 'gitHubReleases'
},
prerelease: false,
releaseType: "release",
authToken: process.env.GH_TOKEN
}
}
]
}
Any help is greatly appreciated.
Thank you,
you should open the wine terminal to run command of build electron.
Related
after installing sqlite3 in electron app and writing code to create database, app returns error and doesn't start
error returned:
Error: Cannot find module 'C:\Users\web_walkerX\Documents\Techdroid\Desktop\cranesoft-desktop - Copy\node_modules\sqlite3\lib\binding\napi-v3-win32-unknown-x64\node_sqlite3.node'
at Module._resolveFilename (internal/modules/cjs/loader.js:584:15)
at Function.Module._resolveFilename (C:\Users\web_walkerX\Documents\Techdroid\Desktop\cranesoft-desktop - Copy\node_modules\electron\dist\resources\electron.asar\common\reset-search-paths.js:43:12)
at Function.Module._load (internal/modules/cjs/loader.js:510:25)
at Module.require (internal/modules/cjs/loader.js:640:17)
at require (internal/modules/cjs/helpers.js:20:18)
at Object.<anonymous> (C:\Users\web_walkerX\Documents\Techdroid\Desktop\cranesoft-desktop - Copy\node_modules\sqlite3\lib\sqlite3-binding.js:4:17)
at Object.<anonymous> (C:\Users\web_walkerX\Documents\Techdroid\Desktop\cranesoft-desktop - Copy\node_modules\sqlite3\lib\sqlite3-binding.js:7:3)
at Module._compile (internal/modules/cjs/loader.js:693:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:704:10)
at Module.load (internal/modules/cjs/loader.js:602:32)
see image below
code to create local DB
const createLocalDB = () => {
let db = new sqlite3.Database("../../data/cranesoft.sqlite3", (err) => {
if (err) {
console.log('Error when creating the database', err)
} else {
console.log('Database created!')
/* Put code to create table(s) here */
// createTable()
}
})
}
createLocalDB()
module.exports = createLocalDB
I have sqlite installed locally and it works without problem, all commands work as expected. I can create dbs from the shell and the rest
Below is an image of sqlite working from the shell
Several SO answers say to run "rebuild": "electron-rebuild -f -w sqlite3" after sqlite3 installation, doing this returns the following error
I have also tried "postinstall": "electron-builder install-app-deps" which didn't work
I have also tried the intructions on https://github.com/nodejs/node-gyp to build node-gyp,
I installed visual studio 2022 (desktop development with c++ selected), all relevant development SDKs and libraries were installed yet sqlite error persists
this is my package.json
"name": "appname",
"version": "1.0.0",
"description": "play",
"main": "main.js",
"scripts": {
"start": "electron .",
"postinstall": "electron-builder install-app-deps",
"pack": "electron-builder --dir",
"dist": "electron-builder",
"rebuild": "electron-rebuild -f -w sqlite3"
},
"repository": "",
"keywords": [
"palymaker"
],
"author": "Playmaker Systems",
"license": "CC0-1.0",
"dependencies": {
"axios": "^0.24.0",
"bootstrap": "^3.3.5",
"ejs": "^3.0.1",
"ejs-electron": "^2.1.1",
"electron-print-dialog": "0.1.0-alpha.1",
"electron-router": "^0.5.1",
"electron-squirrel-startup": "^1.0.0",
"express": "^4.17.1",
"jquery": "^3.3.1",
"mysql2": "^2.3.3",
"nodemon": "^2.0.2",
"sequelize": "^6.9.0",
"twbs-pagination": "^1.4.2"
},
"devDependencies": {
"browser-sync": "2.26.3",
"electron": "^4.2.12",
"electron-builder": "^22.14.13",
"electron-rebuild": "^3.2.7",
"gulp": "4.0.0",
"sqlite3": "^5.0.8"
},
"build": {
"appId": "com.palymaker.appname",
"dmg": {
"contents": [
{
"x": 110,
"y": 150
},
{
"x": 240,
"y": 150,
"type": "link",
"path": "/Applications"
}
]
},
"linux": {
"target": [
"AppImage",
"deb"
]
},
"win": {
"target": [
"nsis",
"msi"
],
"icon": "build/appname-icon.ico"
},
"nsis": {
"oneClick": false,
"allowToChangeInstallationDirectory": true,
"installerIcon": "build/appname-icon.ico",
"uninstallerIcon": "build/appname-icon.ico",
"deleteAppDataOnUninstall": true,
"runAfterFinish": true,
"createDesktopShortcut": "always",
"createStartMenuShortcut": true,
"shortcutName": "appnameDesktop",
"allowElevation": true
}
}
}
Operating system: Windows 10
node version: 14.17.5
All help is appreciated
Hi I have an Electron app that's running Puppeteer (To be specific it is puppeteer-cluster). I want to be able to package this app into a .exe that I can distribute with.
One requirement though is that I have to be able to pack it with --asar.
Here's some stuff I tried but failed:
I tried setting the executable path :
let ChromiumPath = path.join(__dirname, "..", "..", "..",".local-chromium", "win64-809590", "chrome-win","chrome.exe");
const cluster = await Cluster.launch({
puppeteer,
concurrency: Cluster.CONCURRENCY_BROWSER,
maxConcurrency: arg.length,
timeout: 340000,
puppeteerOptions: {
args: browserArgs,
headless: false,
ignoreHTTPSErrors: true,
executablePath : ChromiumPath
},
perBrowserOptions: perBrowserOptions,
});
I tried specifying the unpack directory in package.json
"config": {
"forge": {
"packagerConfig": {
"asar": {
"unpack": "**/node_modules/puppeteer/.local-chromium/**/*"
}
}.....
Here's how i package my app:
electron-packager . --asar
And if needed, here's my package.json:
{
"name": "testBrowsers",
"productName": "testBrowsers",
"version": "1.0.0",
"description": "IDk",
"main": "src/index.js",
"scripts": {
"start": "electron-forge start",
"package": "electron-packager ./ testBrowsers --platform=win32 --arch=x64 --icon=./tool.ico --out=./dist --electron-version=10.1.4 --overwrite",
"make": "electron-forge make",
"publish": "electron-forge publish",
"lint": "echo \"No linting configured\""
},
"keywords": [],
"author": "Otter",
"license": "MIT",
"config": {
"forge": {
"packagerConfig": {
"asar": {
"unpack": "**/node_modules/puppeteer/.local-chromium/**/*"
}
},
"makers": [
{
"name": "#electron-forge/maker-squirrel",
"config": {
"name": "testBrowsers"
}
},
{
"name": "#electron-forge/maker-zip",
"platforms": [
"darwin"
]
},
{
"name": "#electron-forge/maker-deb",
"config": {}
},
{
"name": "#electron-forge/maker-rpm",
"config": {}
}
]
}
},
"dependencies": {
"electron-squirrel-startup": "^1.0.0",
"proxy-chain": "^0.4.5",
"puppeteer": "^5.4.1",
"puppeteer-cluster": "^0.22.0",
"puppeteer-extra": "^3.1.15",
"puppeteer-extra-plugin-stealth": "^2.6.5",
"puppeteer-page-proxy": "^1.2.8",
"taskkill": "^3.1.0"
},
"devDependencies": {
"#electron-forge/cli": "^6.0.0-beta.54",
"#electron-forge/maker-deb": "^6.0.0-beta.54",
"#electron-forge/maker-rpm": "^6.0.0-beta.54",
"#electron-forge/maker-squirrel": "^6.0.0-beta.54",
"#electron-forge/maker-zip": "^6.0.0-beta.54",
"electron": "10.1.4"
}
}
Thanks I really hope someone can help me out with this issue! :)
You will probably need to package chromium separately from your application. At least that's what you would do when trying to package a node application using something like pkg.
You can load chromium in puppeteer from a custom install path when launching a browser instance. So in code you will need to specify that path and make sure that your packaged app has the ability to read that path.
Your distribution file (probably an archive) will then have the chromium build that puppeteer needs separate from the actual app exe
have a look at a similar discussion here
https://github.com/vercel/pkg/issues/204
I wanted to use electron-builder in my electron-forge (webpack-template and React) app, because of the more packaging options
electron-forge app was created with
create electron-app test --template=webpack
This is my package.json
"name": "vocascan",
"productName": "vocascan",
"version": "1.0.0",
"description": "My Electron application description",
"main": ".webpack/main",
"scripts": {
"start": "electron-forge start",
"package": "electron-forge package",
"make": "electron-forge make",
"publish": "electron-forge publish",
"lint": "echo \"No linting configured\"",
"build": "electron-forge start && electron-builder --linux"
},
"keywords": [],
"build": {
"productName": "Vocascan",
"files": [
],
"linux": {
"target": [
"AppImage"
],
"category": "Development"
}
},
"license": "MIT",
"config": {
"forge": {
"packagerConfig": {},
"plugins": [
[
"#electron-forge/plugin-webpack",
{
"mainConfig": "./webpack.main.config.js",
"renderer": {
"config": "./webpack.renderer.config.js",
"entryPoints": [
{
"html": "./src/index.html",
"js": "./src/renderer.jsx",
"name": "main_window"
}
]
}
}
]
]
},
"devDependencies": {
"#electron-forge/cli": "^6.0.0-beta.54",
"#electron-forge/maker-deb": "^6.0.0-beta.54",
"#electron-forge/maker-rpm": "^6.0.0-beta.54",
"#electron-forge/maker-squirrel": "^6.0.0-beta.54",
"#electron-forge/maker-zip": "^6.0.0-beta.54",
"#electron-forge/plugin-webpack": "6.0.0-beta.54",
"#marshallofsound/webpack-asset-relocator-loader": "^0.5.0",
"css-loader": "^4.2.1",
"electron": "10.1.5",
"node-loader": "^1.0.1",
"style-loader": "^1.2.1",
"electron-builder": "^22.9.1"
},
"dependencies": {
"#babel/core": "^7.12.3",
"#babel/preset-env": "^7.12.1",
"#babel/preset-react": "^7.12.5",
"babel-loader": "^8.1.0",
"electron-squirrel-startup": "^1.0.0",
"react": "^17.0.1",
"react-dom": "^17.0.1"
}
As you can see I added
"build": "electron-forge start && electron-builder --linux"
and
"build": {
"productName": "Vocascan",
"files": [
],
"linux": {
"target": [
"AppImage"
],
"category": "Development"
}
},
in order to make electron-builder available
the build runs just fine, but when I start the app none of my components gets shown
If someone needs the browser window code
const createWindow = () => {
// Create the browser window.
const mainWindow = new BrowserWindow({
width: 800,
height: 600,
});
// and load the index.html of the app.
mainWindow.loadURL(MAIN_WINDOW_WEBPACK_ENTRY);
// Open the DevTools.
mainWindow.webContents.openDevTools();
};
and this is my folder structure
This template is NOT working with electron-builder.
Because this template was designed to work with the electron-forge make command. electron-builder can't work with it because it's using webpack dev server and not building a static build.
The template I linked is working with electron-builder because it's making a static build of react, the react components and the node modules you using and electron-builder can work with it.
I recommend this template: https://github.com/Levminer/create-electron-react-app
I don't quite know what happened to my build, Currently gatsby develop is returning TypeError: Cannot read property 'allMarkdownRemark' of undefined pointing to this file
gatsby-node.js:19 graphql.then.results
C:/Users/Anders/sites/gatsby-netlify-cms/gatsby-node.js:19:20
and gatsby info is returning after it returns info about the project error The system cannot find the path specified.
Here is the gatsby-node.js file
const path = require('path')
exports.createPages = ({ graphql, actions }) => {
const { createPage } = actions
return new Promise((resolve, reject) => {
graphql(`
{
allMarkdownRemark {
edges {
node {
frontmatter {
slug
}
}
}
}
}
`).then(results => {
results.data.allMarkdownRemark.edges.forEach(({ node }) => {
createPage({
path: `/posts${node.frontmatter.slug}`,
component: path.resolve('./src/components/postLayout.js'),
context: {
slug: node.frontmatter.slug,
},
})
})
resolve()
})
})
}
I don't quite understand what is going on, I rolled back to changes that were working fine a minute ago, and now getting this weird error. I have tried upgrading node, I have tried reinstalling the gatsby cli. I am stuck. Thanks in advance.
Also including my package.json in case there is incompatibilities
{
"name": "gatsby-starter-default",
"description": "Gatsby default starter",
"version": "1.0.0",
"author": "Kyle Mathews <mathews.kyle#gmail.com>",
"dependencies": {
"babel-plugin-styled-components": "^1.9.2",
"gatsby": "^2.0.53",
"gatsby-image": "^2.0.22",
"gatsby-plugin-manifest": "^2.0.9",
"gatsby-plugin-netlify": "^2.0.6",
"gatsby-plugin-netlify-cms": "^3.0.9",
"gatsby-plugin-offline": "^2.0.16",
"gatsby-plugin-react-helmet": "^3.0.2",
"gatsby-plugin-sharp": "^2.0.15",
"gatsby-plugin-sitemap": "^2.0.3",
"gatsby-plugin-styled-components": "^3.0.4",
"gatsby-source-filesystem": "^2.0.10",
"gatsby-transformer-remark": "^2.1.15",
"gatsby-transformer-sharp": "^2.1.9",
"netlify-cms": "^2.3.0",
"react": "^16.6.3",
"react-dom": "^16.6.3",
"react-helmet": "^5.2.0",
"react-spring": "^6.1.10",
"styled-components": "^4.1.2"
},
"keywords": [
"gatsby"
],
"license": "MIT",
"scripts": {
"build": "gatsby build",
"develop": "gatsby develop",
"start": "npm run develop",
"format": "prettier --write \"src/**/*.js\"",
"test": "echo \"Error: no test specified\" && exit 1"
},
"devDependencies": {
"prettier": "^1.15.2"
},
"repository": {
"type": "git",
"url": "https://github.com/gatsbyjs/gatsby-starter-default"
}
}
Gatsby -v returns 2.4.7 and I am running node v10.14.2
Here is my gatsby-config file
module.exports = {
siteMetadata: {
title: 'Project Name',
content: 'your name is weird',
siteUrl: 'https://zealous-wright-0d00e0.netlify.com',
},
plugins: [
'gatsby-plugin-react-helmet',
{
resolve: `gatsby-source-filesystem`,
options: {
name: `images`,
path: `${__dirname}/src/images`,
},
},
'gatsby-plugin-sitemap',
'gatsby-transformer-sharp',
'gatsby-plugin-styled-components',
'gatsby-plugin-sharp',
{
resolve: `gatsby-plugin-manifest`,
options: {
name: 'project-name',
short_name: 'project-name',
start_url: '/',
background_color: '#663399',
theme_color: '#663399',
display: 'minimal-ui',
icon: 'src/images/logo.png', // This path is relative to the root of the site.
},
},
// this (optional) plugin enables Progressive Web App + Offline functionality
// To learn more, visit: https://gatsby.app/offline
'gatsby-plugin-offline',
{
resolve: 'gatsby-source-filesystem',
options: {
path: `${__dirname}/src/team`,
name: 'team',
},
},
{
resolve: 'gatsby-source-filesystem',
options: {
path: `${__dirname}/src/images`,
name: 'images',
},
},
'gatsby-transformer-remark',
'gatsby-plugin-netlify-cms',
],
}
and I have a file in the gatsby-source-filesystem at src/team/riels-first-post.md
I had a very stupid bug, inside my markdown file there was no slug attribute which was being referenced across my code. This is what it should of looked like
---
title: Riel's First post
bio: I am a monkey with a dog
slug: "test"
---
Testing
You haven't posted your gatsby-config file but, judging by the error, I would say that your node file failed to find any markdown files which results in an undefined results.data.
In your gatsby config file there should be a directive similar to this one:
{
resolve: `gatsby-source-filesystem`,
options: {
name: `posts`,
path: `${__dirname}/static/content/collections/posts`,
},
}
The above code instructs gatsby to look for markdown files in the specified path so make sure you have this directive inside your config and that the path contains at least one valid markdown file.
I'm having an issue when building my web application using Brunch. My application depends on a module I've created and uploaded to NPM, and whenever I build it, I get:
DEPS_RESOLVE_FAILED of node_modules/rd-vue-bootstrap/dist/rd-vue-bootstrap.js failed.
Could not load module './bs-button-group.vue' from '/Users/rjuliani/dev/production-manager-ui/node_modules/rd-vue-bootstrap/dist'.
Make sure the file actually exists
The module itself builds just fine, however when I use it from my test web application and build it (the web application) it throw me the above error.
The relevant parts of my package.json file for the module are:
"main": "dist/rd-vue-bootstrap.js",
"files": [
"dist/rd-vue-bootstrap.js",
"dist/rd-vue-bootstrap.js.map",
"dist/rd-vue-bootstrap.min.js",
"src"
],
brunch-config.js
module.exports = {
files: {
javascripts: {
joinTo: 'app.js'
},
templates: {
joinTo: 'app.js'
}
},
plugins: {
babel: {
},
assetsmanager: {
copyTo: {
'vendor': ['node_modules/bootstrap', 'node_modules/jquery', 'node_modules/rd-vue-bootstrap']
},
minTimeSpanSeconds: 10 // assets won't be copied more frequent than once per X seconds.npm
}
}
};
initialize.js (main file for my web application)
import Vue from 'vue';
import RdVueBootstrap from 'rd-vue-bootstrap';
Vue.use(RdVueBootstrap);
Finally, package.json for my test web application
{
"name": "production-manager-ui",
"description": "Simple UI for the production-manager API project",
"version": "0.0.1",
"license": "MIT",
"repository": {
"type": "git",
"url": "https://github.com/radical-dreamers/production-manager-ui.git"
},
"scripts": {
"watch": "brunch watch --server",
"build": "brunch build --production"
},
"author": {
"url": "http://www.codelightsoftware.com",
"name": "Rodrigo Juliani",
"email": "srodriki#gmail.com"
},
"keywords": [
"vue",
"brunch"
],
"dependencies": {
"bootstrap": "^3.3.7",
"jquery": "^3.1.0",
"rd-vue-bootstrap": "0.0.6",
"vue": "^1.0.26",
"vue-router": "^0.7.13"
},
"devDependencies": {
"assetsmanager-brunch": "^1.8.1",
"auto-reload-brunch": "^2.7.1",
"babel-brunch": "^6.0.6",
"brunch": "^2.8.2",
"css-brunch": "^2.6.1",
"javascript-brunch": "^2.0.0",
"vue-brunch": "^1.1.2",
"vue-devtools": "^2.0.4"
}
}
Any ideas how to fix this? I've tried many things and nothing seems to be working as of right now :(
Thanks!