Launching renderer functions from the main menu in Electron-Vue

Creating menus is simple enough in Electron, but how in the world do you tell your Renderer process to do something?! I couldn’t find any existing resources on this so hopefully this helps you.

In your menu/index.js  set up your menu:

import { app, BrowserWindow, Menu } from 'electron'

const template = [
    label: 'Test',
    submenu: [
        label: 'Launch a function in Renderer process',
        click: () => { mainWindow.webContents.send('hello', 'Hello World!') }

const menu = Menu.buildFromTemplate(template)

In your renderer/main.js  add a listening function:

import router from './router'
const electron = require('electron')

electron.ipcRenderer.on('hello', (event, arg) => {
  // Get the current Vue instance (i.e. which component/route is currently active)
  let component = router.currentRoute.matched[0].instances.default

  component.someReactiveData = 'Received message from main process

Tada! You can now successfully run any renderer function you like from your application menus. 🙂

Here’s some other types of ways you can communicate between the two processes:

4 thoughts on “Launching renderer functions from the main menu in Electron-Vue

    1. I had added it to the Vue prototype, but you can access Electron from the renderer process like this:

      const electron = require('electron')

  1. Welcome Everyone
    Thanks for checking out my writing website . My name is Philip.
    I have worked several years in this niche. My passion for writing started at a young age. I wrote journaled as a child and eventually went on to work with my school newspaper.
    This early tryst into reporting eventually led me to academic writing. There is plenty of work for qualified writers. I specialize in essays, but have the skills to do all types of academic writing.
    Reach out for more information about rates and a price quote. I’m looking forward to helping you.

    Academic Writer – Philip – http://www.cleanurbanenergy.comBand

Leave a Reply

Your email address will not be published. Required fields are marked *