vue-cli-plugin-electron-builder
vue-cli-plugin-electron-builder copied to clipboard
Awaiting win.loadURL in createWindow() blocks events from firing
Describe the bug
The template for background.js
uses await win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
to load the vue server in development. For some reason this prevents the dom-ready
, did-finish-load
, ready-to-show
events in the main process from firing reliably and also the mounted event in vue.
To Reproduce
Create a new project and create listeners for any of the events above. They most likely will not fire. Removing await
from win.loadURL
will allow these events to fire.
Expected behavior The development server or build process should not interfere with the events.
Environment (please complete the following information):
Custom vue.config.js
to enable node integration:
module.exports = {
pluginOptions: {
electronBuilder: {
nodeIntegration: true
}
}
}
terminal output from running vue info
:
Environment Info:
System:
OS: Windows 10 10.0.19044
CPU: (12) x64 Intel(R) Core(TM) i7-8086K CPU @ 4.00GHz
Binaries:
Node: 16.13.1 - C:\Program Files\nodejs\node.EXE
Yarn: Not Found
npm: 8.1.2 - C:\Program Files\nodejs\npm.CMD
Browsers:
Chrome: 96.0.4664.110
Edge: Spartan (44.19041.1266.0), Chromium (96.0.1054.57)
npmPackages:
@vue/babel-helper-vue-jsx-merge-props: 1.2.1
@vue/babel-helper-vue-transform-on: 1.0.2
@vue/babel-plugin-jsx: 1.1.1
@vue/babel-plugin-transform-vue-jsx: 1.2.1
@vue/babel-preset-app: 4.5.15
@vue/babel-preset-jsx: 1.2.4
@vue/babel-sugar-composition-api-inject-h: 1.2.1
@vue/babel-sugar-composition-api-render-instance: 1.2.4
@vue/babel-sugar-functional-vue: 1.2.2
@vue/babel-sugar-inject-h: 1.2.2
@vue/babel-sugar-v-model: 1.2.3
@vue/babel-sugar-v-on: 1.2.3
@vue/cli-overlay: 4.5.15
@vue/cli-plugin-babel: ~4.5.0 => 4.5.15
@vue/cli-plugin-router: ~4.5.0 => 4.5.15
@vue/cli-plugin-vuex: 4.5.15
@vue/cli-service: ~4.5.0 => 4.5.15
@vue/cli-shared-utils: 4.5.15
@vue/component-compiler-utils: 3.3.0
@vue/preload-webpack-plugin: 1.1.2
@vue/web-component-wrapper: 1.3.0
vue: ^2.6.11 => 2.6.14
vue-analytics: 5.22.1
vue-cli-plugin-electron-builder: ~2.1.1 => 2.1.1
vue-cli-plugin-tailwind: ~2.2.18 => 2.2.18
vue-hot-reload-api: 2.3.4
vue-loader: 15.9.8 (16.8.3)
vue-router: ^3.2.0 => 3.5.3
vue-style-loader: 4.1.3
vue-template-compiler: ^2.6.11 => 2.6.14
vue-template-es2015-compiler: 1.9.1
vue-unicons: ^3.3.1 => 3.3.1
npmGlobalPackages:
@vue/cli: Not Found
Hmm, this is an interesting issue. I added the await because it fixed some issues with devtools, but I think using .then
would work for that. Try using this code and let me know if it fixes your issue:
win.loadURL(process.env.WEBPACK_DEV_SERVER_URL).then(() => {
if (!process.env.IS_TEST) win.webContents.openDevTools()
})
Old issue I know, sorry, but just wanted to +1 and say I also had this issue and was scratching my head as to why the events weren't firing.
Removed async
/ await
from my window creation functions, used .then()
and they started working..!