{"id":18910,"library":"vue-electron","title":"vue-electron","description":"vue-electron (v1.0.6, last updated 2017) is a Vue.js plugin that attaches all Electron APIs to the Vue prototype, making them accessible via `this.$electron` in any component. It eliminates the need to import `electron` in every file, simplifying integration in electron-vue boilerplate projects. The plugin is a thin wrapper that installs via `Vue.use()`. It is stable but no longer actively maintained; users are encouraged to migrate to modern approaches like `window.require('electron')` or using the `@electron/remote` package directly. Release cadence is low, with no recent updates.","status":"deprecated","version":"1.0.6","language":"javascript","source_language":"en","source_url":"https://github.com/SimulatedGREG/vue-electron","tags":["javascript","vue","electron","api","wrapper"],"install":[{"cmd":"npm install vue-electron","lang":"bash","label":"npm"},{"cmd":"yarn add vue-electron","lang":"bash","label":"yarn"},{"cmd":"pnpm add vue-electron","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency - plugin requires Vue to be installed","package":"vue","optional":false}],"imports":[{"note":"Package does not export a CommonJS module; works only in webpack/browserify environments. Since v1.0.0, default import is required.","wrong":"const VueElectron = require('vue-electron')","symbol":"VueElectron","correct":"import VueElectron from 'vue-electron'"},{"note":"Access via `this.$electron` in any Vue component after installing plugin. No need to import electron separately.","wrong":"this.$electron.remote.require('electron')","symbol":"$electron","correct":"this.$electron in components"},{"note":"Plugin must be installed with Vue.use(), not instantiated directly.","wrong":"new VueElectron()","symbol":"Vue.use","correct":"Vue.use(VueElectron)"}],"quickstart":{"code":"// main.js\nimport Vue from 'vue'\nimport VueElectron from 'vue-electron'\n\nVue.use(VueElectron)\n\nnew Vue({\n  el: '#app',\n  render: h => h(App)\n})\n\n// MyComponent.vue\nexport default {\n  methods: {\n    openExternalLink(url) {\n      // Access electron APIs via this.$electron\n      this.$electron.shell.openExternal(url)\n    }\n  }\n}","lang":"javascript","description":"This shows how to install vue-electron, then use this.$electron in a component to call Shell.openExternal."},"warnings":[{"fix":"Migrate to using `window.require('electron')` or install `@electron/remote` and use `remote.require('electron')`.","message":"Package is no longer maintained since 2017. Use in new projects is discouraged.","severity":"deprecated","affected_versions":"*"},{"fix":"Install @electron/remote and enable remote module via main process; then use window.require('electron') instead.","message":"Does not work with Electron >= 10 because remote module is removed. The plugin relies on `remote` which requires explicit package `@electron/remote`.","severity":"gotcha","affected_versions":">=10.0.0"},{"fix":"Use Vue 2 or manually assign electron APIs using Vue.prototype.$electron = require('electron').","message":"Not compatible with Vue 3 (Vue.createApp vs Vue.use pattern changed).","severity":"gotcha","affected_versions":">=3.0.0"},{"fix":"Disable contextIsolation in BrowserWindow options or use preload script to expose electron APIs safely.","message":"Plugin does not support Electron's sandbox mode or contextIsolation: true. Accessing this.$electron may fail.","severity":"breaking","affected_versions":">=5.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Ensure Vue.use(VueElectron) is called before creating the root Vue instance.","cause":"Accessing this.$electron before Vue plugin is installed.","error":"TypeError: Cannot read property 'electron' of undefined"},{"fix":"Only use vue-electron in Electron renderer process. Check if window.require is available.","cause":"Trying to use vue-electron outside of Electron main/renderer process (e.g., in a browser).","error":"electron is not defined"},{"fix":"Run 'npm install vue-electron' and ensure import path is correct: 'vue-electron' not 'vue-electron/dist/...'.","cause":"Missing dependency or incorrect import path.","error":"Uncaught Error: Cannot find module 'vue-electron'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}