Electron isn't launching on serve:electron

[nklayman]

Some people have reported that serve:electron gets stuck on Launching Electron. This issue is created to centralize these reports.

[nklayman]

Could everyone who has this issue please try these steps:

1. delete node_modules folder
2. run yarn cache clean @vue/cli-service and yarn cache clean vue-cli-plugin-electron-builder (or npm equivalent)
3. make sure to use vue-cli-plugin-electron-builder@1.0.0-alpha.4
4. re-install dependencies
5. try it again

Then, please reply with the following:

• Did it work?
• os and version
• yarn/npm and version
• node version
• vue-cli version
• vue-cli-plugin-electron-builder version
• (if possible) link to your github repo

Thanks a lot guys, I really appreciate the help and hope we can resolve this soon 😄 .

[TAGC]

Did it work?

yarn build:electron works for me, yarn serve:electron gets stuck indefinitely as before.

os and version

macOS High Sierra v10.13.5

yarn/npm and version

Tried with npm 5.6.0, npm 6.1.0 and yarn 1.7.0.

node version

node v10.4.1

vue-cli version

3.0.0-rc.2

vue-cli-plugin-electron-builder version

1.0.0-alpha.5

(if possible) link to your github repo

TAGC/vue-electron-bug@4da71a7

[olgertse]

This issue happened to me when the project was compiling with warnings.
Electron would not launch with yarn serve:electron, but would launch as soon as I stopped the script with ctrl-c.

The issue disappeared when I resolved the warnings in my code.
This happened with vue-cli-plugin-electron-builder@0.3.2

[antoniogiroz]

Hi!

I've upgrade to latest alpha (6) and this was the result:

Did it work?: No
os and version: MacOS X 10.13.4
yarn/npm and version: yarn (1.3.2) npm (6.1.0)
node version: 10.2.1
vue-cli version: 3.0.0-beta.16
vue-cli-plugin-electron-builder version: 1.0.0-alpha.6
link to your github repo: https://github.com/algil/vue-ts

Thanks!!

[nklayman]

@algil @TAGC both of your projects worked fine when I cloned them on Windows. This seems to be a macOS related issue. Unfortunately, I don't have access to a Mac, making this hard to debug. I'm going to create a repo with some scripts I'd like you to run and post it here soon. Thanks for your help.

[nklayman]

To those of you with the issue, I ask for more help. Please clone this repo. Then, do the following:

1. install deps with yarn
2. run yarn serve:electron. Leave it running and make sure it is hosted on http://localhost:8080.
3. while that is running, run yarn electron bg.js, and then yarn electron ./bg.js. Let me know if either works.
4. while the server is still running, even if the previous commands worked, run node ./script-1.js.
5. repeat step 5 with scripts 2-6.
6. reply to this issue with the results and, if you haven't already, the information I previously requested.

Thanks you all, hoping to get this fixed so you can try this out!

[antoniogiroz]

Hi!

• Running yarn electron bg.js and yarn electron ./bg.js: It works
• Running node ./script-{n}.js: It works too

Every time with the same result.

Btw, app is blank in http://localhost:8080 and an error is shown in the console:

Regards!

[TAGC]

Testing on Windows 10. With the repo you provide:

• Running yarn serve:electron worked fine off the bat - it bundles and launches as expected
• All other commands (yarn electron bg.js ... node ./script-6.js) fail with "Access Error: 404 - Not Found", but that's fine because yarn serve:electron works already anyway

I also found that yarn serve:electron works fine for my own repo (TAGC/vue-electron-bug) now that I'm trying it on Windows 10. Seems to confirm that it's a macOS / unix-specific issue.

[nklayman]

@algil based on the feedback you gave, i created a new branch in this repo (test-launch-1). Go ahead and clone this repo, then do the following:

1. switch to the test-launch-1 branch (git checkout test-launch-1)
2. install deps (yarn install)
3. link it with yarn link
4. in the vcp-electron-builder-launch-bug repo, run yarn link vue-cli-plugin-electron-builder
5. run yarn serve:electron --launch 1
6. run yarn serve:electron --launch 2
7. run yarn serve:electron --launch 3
8. let me know which launch methods work

Thanks for your help!

Edit: also, did the require is not defined error appear in the browser or in electron?

[olgertse]

@nklayman All three methods launched Electron, but app launched with method 2 crashed.
Here is the stack trace from the dev tools:

webpack:///(webpack)/hot/dev-server.js?:7 Uncaught Error: [HMR] Hot Module Replacement is disabled.
    at eval (webpack:///(webpack)/hot/dev-server.js?:7:8)
    at Object../node_modules/webpack/hot/dev-server.js (http://localhost:8080/app.js:998:1)
    at __webpack_require__ (http://localhost:8080/app.js:20:30)
    at eval (webpack:///multi_(webpack)-dev-server/client?:2:1)
    at Object.0 (http://localhost:8080/app.js:1150:1)
    at __webpack_require__ (http://localhost:8080/app.js:20:30)
    at http://localhost:8080/app.js:84:18
    at http://localhost:8080/app.js:87:10

And this is from the terminal after I kill the script:

TypeError: Cannot read property 'on' of undefined
    at serve.then.server (/Users/username/sandbox/vue-cli-plugin-electron-builder/index.js:262:17)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:118:7)

Testing on macOS High Sierra 10.13.5

[antoniogiroz]

Hi @nklayman! You're welcome.

Sorry for my delay. I just tried it and this are the results:

- launch 1: WORKS
- launch 2: WORKS but I get the same error commented by @od1k in above comment
- launch 3: WORKS

Regards!

[nklayman]

Thanks for all of your help! alpha.9 uses the new launch method 🎉! Don't forget to unlink the test-launch-1 package.

[antoniogiroz]

Great!

It works with alpha.9!

Thanks!

[TAGC]

alpha.9 launches the electron app fine in vue-electron-bug, even on macOS (haven't tried Windows but that probably works too). 👍

In a real Electron project that uses TypeScript I get this error after updating to alpha.9, re-invoking the plugin (vue invoke electron-builder) and then trying to launch my app:

$ npm run dev

> @<company>/atm-prototype@0.0.0 dev /Users/<me>/Documents/VSCode/atm-prototype
> vue-cli-service serve:electron

Bundling main process:

[ 'multi ./src/background.ts\nModule not found: Error: Can\'t resolve \'ts-loader\' in \'/Users/<me>/Documents/VSCode/atm-prototype\'\nresolve \'ts-loader\' in \'/Users/<me>/Documents/VSCode/atm-prototype\'\n  Parsed request is a module\n  using description file: /Users/<me>/Documents/VSCode/atm-prototype/package.json (relative path: .)\n    resolve as module\n      /Users/<me>/Documents/VSCode/node_modules doesn\'t exist or is not a directory\n      /Users/<me>/Documents/node_modules doesn\'t exist or is not a directory\n      /Users/<me>/node_modules doesn\'t exist or is not a directory\n      /Users/node_modules doesn\'t exist or is not a directory\n      /node_modules doesn\'t exist or is not a directory\n      looking for modules in /Users/<me>/Documents/VSCode/atm-prototype/node_modules\n        using description file: /Users/<me>/Documents/VSCode/atm-prototype/package.json (relative path: ./node_modules)\n          using description file: /Users/<me>/Documents/VSCode/atm-prototype/package.json (relative path: ./node_modules/ts-loader)\n            no extension\n              /Users/<me>/Documents/VSCode/atm-prototype/node_modules/ts-loader doesn\'t exist\n            .js\n              /Users/<me>/Documents/VSCode/atm-prototype/node_modules/ts-loader.js doesn\'t exist\n            .json\n   /Users/<me>/Documents/VSCode/atm-prototype/node_modules/ts-loader.json doesn\'t exist\n            as directory\n              /Users/<me>/Documents/VSCode/atm-prototype/node_modules/ts-loader doesn\'t exist\n[/Users/<me>/Documents/VSCode/node_modules]\n[/Users/<me>/Documents/node_modules]\n[/Users/<me>/node_modules]\n[/Users/node_modules]\n[/node_modules]\n[/Users/<me>/Documents/VSCode/atm-prototype/node_modules/ts-loader]\n[/Users/<me>/Documents/VSCode/atm-prototype/node_modules/ts-loader.js]\n[/Users/<me>/Documents/VSCode/atm-prototype/node_modules/ts-loader.json]\n @ multi ./src/background.ts' ]
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @<company>/atm-prototype@0.0.0 dev: `vue-cli-service serve:electron`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @<company>/atm-prototype@0.0.0 dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

[nklayman]

Try running yarn add --dev ts-loader as it seems like that is the error. TS-loader should be installed with cli-plugin-typescript as it is listed in the package.json. If that doesn't work please post your package.json as well.

[TAGC]

ts-loader was already a transitive dependency via cli-plugin-typescript like you point out:

$ npm ls ts-loader
@<company>/atm-prototype@0.0.0 /Users/<me>/Documents/VSCode/atm-prototype
└─┬ @vue/cli-plugin-typescript@3.0.0-rc.2
  └── ts-loader@4.4.1

However, installing it directly allowed the launch to get a lot further before failing:

$ npm run dev

> @<company>/atm-prototype@0.0.0 dev /Users/<me>/Documents/VSCode/atm-prototype
> vue-cli-service serve:electron

Bundling main process:

Hash: 46cac84ec1affb4607fe
Version: webpack 4.12.0
Time: 1103ms
Built at: 22/06/2018 20:08:59
        Asset      Size      Chunks             Chunk Names
background.js  4.68 KiB  background  [emitted]  background
Entrypoint background = background.js
[./src/background.ts] 1.46 KiB {background} [built]
[electron] external "electron" 42 bytes {background} [built]
[path] external "path" 42 bytes {background} [built]
[url] external "url" 42 bytes {background} [built]
[0] multi ./src/background.ts 28 bytes {background} [built]

Starting development server:

 INFO  Starting development server...
Starting type checking and linting service...
Using 1 worker with 2048MB memory limit
 94% after seal

 ERROR  Failed to compile with 1 errors                                                                                                             20:09:07

This dependency was not found:

* assets/grid-tile.png in ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"/Users/<me>/Documents/VSCode/atm-prototype/node_modules/.cache/v
ue-loader","cacheIdentifier":"35be9504-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cach
e-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/workspace/BlueprintTile.vue?vue&type=template&id=3dc92667&
functional=true

To install it, you can run: npm install --save assets/grid-tile.png
Type checking and linting in progress...
No type errors found
No lint errors found
Version: typescript 2.9.2, tslint 5.10.0
Time: 8553ms

I think the problem is that when I try launching it, it's not using the webpack.config that vue-cli generates. For example, running vue inspect shows me that the vue-cli webpack.config would bundle up my images with url-loader:

test: /\.(png|jpe?g|gif|webp)(\?.*)?$/,
use: [
  {
    loader: 'url-loader',
    options: {
      limit: 4096,
      name: 'img/[name].[hash:8].[ext]'
    }
  }
]

[nklayman]

Make sure you use a relative path to your assets directory as described in the Vue cli docs. Assets in the public directory require extra config as of now (update coming soonish) but src/assets should work as-is. Im camping over the weekend w/out cell service so I won't be able to reply after this, sorry.

[nklayman]

Check the README as I added instructions for handling static assets. Make sure you are using 1.0.0-alpha.10 as it has the new features.

[YanDevDe]

This issue is also appearing on latest update "1.4.0" with electron version "6.0.4".
There is no warning or error, just "INFO Launching Electron..." and nothing else.

[zcyc]

it's not run on linux now

when i run npm run electron:serve

[jerryshell]

This issue is also appearing on latest update "1.4.0" with electron version "6.0.4".
There is no warning or error, just "INFO Launching Electron..." and nothing else.

This command can solve this problem:

sudo chown root node_modules/electron/dist/chrome-sandbox && sudo chmod 4755 node_modules/electron/dist/chrome-sandbox

[YanDevDe]

@jerryshell sadly this doesn't fix issue on Windows. I'm now using electron 5.x.x until it has been fixed 👌

[Vallevard]

@chinafreak, with the answer @jerryshell gave, I was thinking maybe it is related to this issue #1972 (I'm not sure)

You could try :
sudo sysctl kernel.unprivileged_userns_clone=1
electron/electron#17972(comment)

[nklayman]

@chinafreak your issue is probably the same as #378.

[YanDevDe]

@Vallevard again, I'm not using linux, so therefore I can't use this command on Windows. 😄
@nklayman yeah that could it be. Then I'll use electron 5 as long it not fixed. I still prefer to use my Dark Mode of Windows lol. Thanks!

[luxalpa]

On my Windows 10 Workstation, both electron:serve and electron:build work flawlessly. On my Windows 10 Laptop electron:build works, but electron:serve gets stuck. The laptop version is a complete fresh install of my project with yarn. Really weird.

[rballonline]

On my Windows 10 Workstation, both electron:serve and electron:build work flawlessly. On my Windows 10 Laptop electron:build works, but electron:serve gets stuck. The laptop version is a complete fresh install of my project with yarn. Really weird.

Exact same thing happening to me. Got it working on my other machine, cloned the repo, ran yarn and now same error. Pretty much sucks because this is my first outing with any of this stuff.

[luxalpa]

Didn't find this thread again, but what worked for me was updating Node.js to the latest version.

[rballonline]

What "worked" for me was just repeating the steps of installation and copying the files over to the directory, performing a merge and then a pull that resulted in "Already up to date". Time to move on to actually doing something.

[amizan8653]

@jerryshell sadly this doesn't fix issue on Windows. I'm now using electron 5.x.x until it has been fixed 👌

Yeah, I couldn't get electron to launch at all until I downgraded down to 5.0.13.

[AravindSyam]

I am using electron 6.0.0, I run yarn electron:serve and it's launched the app.

[ghost]

Hello everybody! I had the same problem with a vue app. My OS is GNU/Linux Debian 10 (x64). I solved it this way:
(1) sudo sysctl kernel.unprivileged_userns_clone=1
(2) remove node_modules folder
(3) run npm install
(4) run npm run electron:serve

After this, everything works normally

[nicklasring]

@linuxArg Do you really want to open up your kernel to a bunch of security vulnerabilities just to be able to run an electron app though?

[rathboma]

@nklayman I'm having launch issues in both Windows 10 and Windows 8.1 with the 2.0.0-beta.5 release. I created a ticket #693.

Basically - electron:serve on Windows 10 or 8.1 with ANY electron version is not working for me. If I downgrade to the pre-2.0 plugin, everything works. I can't figure out what may have changed?

Launching the dev window works fine in both Mac and Linux.

[ajthinking]

Make sure you are running yarn electron:serve and not yarn serve, note to self 😅

[mahmoud-alragabi]

for anyone stuck on Launching Electron or getting this error when running yarn
ERROR: There are no scenarios; must have at least one.
this is because of cmdtest installed on your system which comes installed on a lot of debian based distros
all you have to do is delete that package with : sudo apt remove cmdtest and install yarn after with npm

[bikrambox]

This issue is also appearing on latest update "1.4.0" with electron version "6.0.4".
There is no warning or error, just "INFO Launching Electron..." and nothing else.

This command can solve this problem:

sudo chown root node_modules/electron/dist/chrome-sandbox && sudo chmod 4755 node_modules/electron/dist/chrome-sandbox

This worked for me!
npm electron:serve was not Giving any output but finishes compiling and success toast in the terminal! that's it after this patch, it works. Flawlessly.

[ankitsinghaniyaz]

This works, I can confirm.