Easily Build Your Vue.js App For Desktop With Electron
I'm happy to announce the first alpha of v3 is here! This release mainly updates all dependencies and cleans up some legacy code. There are no docs yet and this hasn't been tested thoroughly so be careful when using this in production. Please give me feedback and issue reports so I can promote this to stable ASAP.
vue add electron-builder@alpha
main
field from your package.json
background.js
shouldn't require any changes, but you can remove the enableRemoteModule
setting for Spectron if it's theretestWithSpectron
has been renamed to testWithPlaywright
, and doesn't take the Spectron import as an arg. The returned app
is now a Playwright ElectronApplication instead of a Spectron instance, and stopServe
has been renamed to stop
. You don't need to install Playwright, it's a dependency of this plugin.This release has been long overdue and this plugin has been in the RC state for way too long, sorry for the delay. Anyways, better late than never, so here it is! If you were running the latest RC previously, there aren't any breaking changes or required migration steps. Thank you to all my supporters who have funded this project and made this release possible :heart::heart:!!
testWithSpectron
function requires you pass the spectron
module as it's first arg, allowing you to specify the version of spectron to be used. You will need to install spectron as a devDependency
testEnvironment
set to node
, see the examples for more detailsinstallVueDevtools
functionA few major deps were upgraded:
These upgrades may cause breaking changes depending on your specific application.
The internal tests are now run on vue cli v4, and it is recommended that you update your app to vue cli v4 as well.
package.json
without dependencies
field (#828)electron
being listed in dependencies
as well as devDependencies
(#829)(yarn add | npm install) -D vue-cli-plugin-electron-builder@latest
to install the 2.0 version of the plugin.background.(js|ts)
, replace nodeIntegration:true
with:// Use pluginOptions.nodeIntegration, leave this alone
// See nklayman.github.io/vue-cli-plugin-electron-builder/guide/security.html#node-integration for more info
nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION
nodeIntegration
, enable it in vue.config.js
:module.exports = {
pluginOptions: {
electronBuilder: {
nodeIntegration: true
}
}
}
testWithSpectron
function, install the proper version of spectron according to the version map, and pass the spectron import at the first argument of all of your testWithSpectron
calls. See the docs for more details.src/background.js
by default) to use electron-devtools-installer:import {
createProtocol,
- installVueDevtools
} from 'vue-cli-plugin-electron-builder/lib'
+ import installExtension, { VUEJS_DEVTOOLS } from 'electron-devtools-installer'
... (around line 77)
-await installVueDevtools()
+await installExtension(VUEJS_DEVTOOLS)
And then run npm i -D electron-devtools-installer
/yarn add -D electron-devtools-installer
.
After following these steps, your project should be good to go with v2.0!
From now on, whenever you add this plugin to your project, electron-devtools-installer will be used instead of the provided installVueDevtools
function. This function was based off of electron-devtools-installer but with some fixes. These fixes have since been merged into electron-devtools-installer (as well as new features like electron v9 support). It is recommended that you switch to electron-devtools-installer as the installVueDevtools
function will be removed in the 2.0.0
final release. To do so, edit your background.(js|ts)
:
import {
createProtocol,
- installVueDevtools
} from 'vue-cli-plugin-electron-builder/lib'
+ import installExtension, { VUEJS_DEVTOOLS } from 'electron-devtools-installer'
... (around line 77)
-await installVueDevtools()
+await installExtension(VUEJS_DEVTOOLS)
And then run npm i -D electron-devtools-installer
/yarn add -D electron-devtools-installer
.
This release contains a handful of fixes:
public
folder wouldn't load due to incorrect process.env.BASE_URL
(#803)background.ts
related to process.env.NODE_INTEGRATION
(#801)testWithSpectron
function requires you pass the spectron
module as it's first arg, allowing you to specify the version of spectron to be used. You will need to install spectron as a devDependency
testEnvironment
set to node
, see the examples for more detailsA few major deps were upgraded:
These upgrades may cause breaking changes depending on your specific application.
The internal tests are now run on vue cli v4, and it is recommended that you update your app to vue cli v4 as well.
(yarn add | npm install) -D vue-cli-plugin-electron-builder@latest
to install the 2.0 version of the plugin.background.(js|ts)
, replace nodeIntegration:true
with:// Use pluginOptions.nodeIntegration, leave this alone
// See nklayman.github.io/vue-cli-plugin-electron-builder/guide/security.html#node-integration for more info
nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION
nodeIntegration
, enable it in vue.config.js
:module.exports = {
pluginOptions: {
electronBuilder: {
nodeIntegration: true
}
}
}
testWithSpectron
function, install the proper version of spectron according to the version map, and pass the spectron import at the first argument of all of your testWithSpectron
calls. See the docs for more details.testWithSpectron
function requires you pass the spectron
module as it's first arg, allowing you to specify the version of spectron to be used. You will need to install spectron as a devDependency
testEnvironment
set to node
, see the examples for more detailsA few major deps were upgraded: teser-webpack-plugin ^1.1.0 -> ^2.0.0 webpack-chain ^5.0.0 -> ^6.0.0 execa: ^1.0.0 -> ^3.0.0 electron-builder: ^21.2.0 -> 22.2.0
These upgrades may cause breaking changes depending on your specific application.
The internal tests are now run on vue cli v4, and it is recommended that you update your app to vue cli v4 as well.
setTimeout(...).unref is not a function
background.(js|ts)
, replace nodeIntegration:true
with:// Use pluginOptions.nodeIntegration, leave this alone
// See https://github.com/nklayman/vue-cli-plugin-electron-builder/blob/v2/docs/guide/configuration.md#node-integration for more info
nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION
nodeIntegration
, enable it in vue.config.js
:module.exports = {
pluginOptions: {
electronBuilder: {
nodeIntegration: true
}
}
}
testWithSpectron
function, install the proper version of spectron according to the version map, and pass the spectron import at the first argument of all of your testWithSpectron
calls. See the docs for more details.This release adds support for electron 6.0.0. However, there are issues with devtools extensions, so vue devtools are disabled by default if electron v6.0.0 is selected.
Features:
Thanks to @Akryum for the Chokidar PR!
With this release, non external deps will not be included in your built app to reduce it's size.
Features: