Unable to run electron app unless electron is installed globally? | electronjs.org | Page 1

lilac magnet Dec 23, 2022, 11:26 AM

#

This is my first time ever using electron,

I just spent about an hour trying to figure out why I couldn't get anything to work. I cloned the quick-start, and followed all the instructions, only to get:

C:\Users\...\Documents\Projects\AutoMM>npm start 

> [email protected] start
> electron .

C:\Users\...\Documents\Projects\AutoMM>

I thought to try installing electron globally as a package, and that worked, however, I don't understand why this is required..
As stated in the quick-start guides and the documentations, you're required to npm i electron and then use npm start

However, the only way I can get my app to launch now is using electron ., which would mean if I try to distribute something I make, they would need electron downloaded globally as well to run..? After installing electron globally, the npm start script still doesn't work. So I'm not sure what the problem here is.
Any help?

alpine vault Dec 23, 2022, 11:28 AM

#

Do you have an error when it's not installed globally?

lilac magnet Dec 23, 2022, 11:29 AM

#

No, the above output is what I get with and without it installed globally. I thought it may have been anti-virus or something, but I disabled all real time protection, and there was no change either

granite wedge Dec 23, 2022, 11:31 AM

#

what you expect to see?

lilac magnet Dec 23, 2022, 11:31 AM

#

I mean this was directly cloning the quick-start, running npm i and then npm start:

C:\Users\...\Documents\Projects\AutoMM>npm start

> [email protected] start
> electron .

C:\Users\...\Documents\Projects\AutoMM>npm start

#

Well I'm expecting to see the electron window, which I can get now by running electron ., but if I distribute this, as I plan to, I can't compile it in a way they can run it since the npm start script doesn't work. I'd have to make the start script electron . and have them globally install electron as well

alpine vault Dec 23, 2022, 11:33 AM

#

Installing electron globally should not be necessary

granite wedge Dec 23, 2022, 11:33 AM

#

npm start do electron .

lilac magnet Dec 23, 2022, 11:33 AM

#

yeah that's what I mean, npm start to electron . is not working

granite wedge Dec 23, 2022, 11:33 AM

#

to distribute this you need other packages

#

electron-packager/forge/builder

lilac magnet Dec 23, 2022, 11:34 AM

#


> [email protected] start
> electron .


C:\Users\amp56\Documents\Projects\AutoMM>electron .

inside main.js

C:\Users\amp56\Documents\Projects\AutoMM>

granite wedge Dec 23, 2022, 11:34 AM

#

show the code

#

this output give me nothing

#

package.json

#

main.js

lilac magnet Dec 23, 2022, 11:35 AM

#

it's the cloned quick-start guide

#

main.js

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

console.log("inside main.js");

function createWindow() {
    const mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            preload: path.join(__dirname, 'preload.js')
        }
    });

    mainWindow.loadFile('./index.html');
}

app.whenReady().then(() => {
    createWindow()

    app.on('activate', function () {
        if (BrowserWindow.getAllWindows().length === 0) createWindow();
        else console.log("error");
    });
});

app.on('window-all-closed', function () {
    if (process.platform !== 'darwin') app.quit();
});

#

{
  "name": "automm",
  "version": "1.0.0",
  "description": "Automates and helps with MM call copy/paste messages, and verification/connection commands",
  "main": "main.js",
  "scripts": {
    "start": "electron ."
  },
  "author": "ComicallyBad",
  "license": "CC0-1.0",
  "devDependencies": {
    "electron": "^22.0.0"
  }
}

alpine vault Dec 23, 2022, 11:36 AM

#

I would say to try activating debug log

#

I think you can use the flag --enable-logging but I'm not sure

granite wedge Dec 23, 2022, 11:37 AM

#

show index.html

#

and project folder structure

lilac magnet Dec 23, 2022, 11:37 AM

#

C:\Users\amp56\Documents\Projects\AutoMM>npm start  

> [email protected] start
> electron . --enable-logging

It's like it's just outputting what the script I enter is, not running anything

lilac magnet Dec 23, 2022, 11:37 AM

#

granite wedge show index.html

It's the literal quick-start github.. cloned.. lol

#

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'" />
    <meta http-equiv="X-Content-Security-Policy" content="default-src 'self'; script-src 'self'" />
    <title>Hello from Electron renderer!</title>
</head>

<body>
    <h1>Hello from Electron renderer!</h1>
    <p>👋</p>
    <p id="info"></p>
</body>
<script src="./renderer.js"></script>

</html>

#

#

preload.js

window.addEventListener('DOMContentLoaded', () => {
    const replaceText = (selector, text) => {
        const element = document.getElementById(selector);
        if (element) element.innerText = text
    }

    for (const type of ['chrome', 'node', 'electron']) {
        replaceText(`${type}-version`, process.versions[type]);
    }
});

alpine vault Dec 23, 2022, 11:38 AM

#

I suppose you already tried to delete node_modules and reinstall?

lilac magnet Dec 23, 2022, 11:39 AM

#

I'll give it a try

#


> [email protected] start
> electron . --enable-logging
``` yeah just the same output again. The start script looks like it's being logged instead of ran for whatever reason. It should still at least run `electron .` fine now I've installed it globally, but seems it's not actually running the cmd in the console

#

Debugger attached.

> [email protected] start
> electron .

Debugger attached.
Waiting for the debugger to disconnect...
Waiting for the debugger to disconnect...

C:\Users\amp56\Documents\Projects\AutoMM>```

granite wedge Dec 23, 2022, 11:45 AM

#

what nodejs version you use?

alpine vault Dec 23, 2022, 11:45 AM

#

Any errors when you run npm install?

lilac magnet Dec 23, 2022, 11:53 AM

#

node.js v17.7.2, and when I npm install, no I get no errors:


17 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities```

alpine vault Dec 23, 2022, 12:03 PM

#

Does it work if you use loadUrl instead of loadFile?

lilac magnet Dec 23, 2022, 12:11 PM

#

this is so strange, I again just cloned the electron-quick-start, npm i, npm start, and it opened. But moving the files from that folder to a new one, running the same commands, nothing opens

#

If i make a new project,
npm init,
npm i electron,
copy all files from the repo,
it won't run lol.
But if I clone the repo,
npm i,
npm start,
it's fine. I have no idea what the difference is.

alpine vault Dec 23, 2022, 12:38 PM

#

The package-lock might be different

lilac magnet Dec 24, 2022, 11:16 PM

#

I tried everything. This is weird, I can get it to run the cloned github quick start, however, didn't realize, after I close the window, I can't re-start the window with npm start. So I can run it once, and after that, not again

sly ether Dec 25, 2022, 9:57 AM

#

lilac magnet node.js v17.7.2, and when I npm install, no I get no errors: ```added 71 package...

Try to run with node 16 or node 18. Node 17 is an odd number. Dont use odd node versions like 15 17 19

lilac magnet Dec 26, 2022, 2:57 AM

#

sly ether Try to run with node 16 or node 18. Node 17 is an odd number. Dont use odd node ...

I updated to node v18.12.1 and same issue. Every time I restart my computer, I can get it to run, but when I close the window, I can't get it to run again... I either have to make a new folder and run it in that folder, or I have to restart my PC. I'm not sure why, but it's very strange. I can't find any processes either to kill that could be causing an issue, as the process I see when I get it to launch, stops once I close the window

sly ether Dec 26, 2022, 3:02 PM

#

lilac magnet I updated to node v18.12.1 and same issue. Every time I restart my computer, I c...

did you try node 16? electron 22 from https://github.com/electron/electron-quick-start/blob/master/package.json is using node 16 under the hood anyway and not node 18 yet. use node v16.17.1 just to make sure that your node version matches the node version used by electron 22 used in the quickstart:
https://releases.electronjs.org/releases/stable

#

i think electron 23 may use node 18 in the future, but this is still alpha/beta stuff which would make getting rid of your problem just worse.

#

and better uninstall the global electron and remove it from npx and npm cache. "npm run <myscript>" (e.g. npm start which is npm run start) is using the electron it will find in the node_modules/bin (?) folder after a "npm install" before downloading anything external. by installing a global electron version you just introduce more potential version mess.

#

"As stated in the quick-start guides and the documentations, you're required to npm i electron and then use npm start". The electorn quick start project has already electorn installed. because of that dont use "npm i electron" with the electron quick start repo.
the process is:

use git clone to get this: https://github.com/electron/electron-quick-start
open vs code inside the git cloned folder
npm install
npm start

#Unable to run electron app unless electron is installed globally?