All in one electron starter

What is this?

I was so often looking for a simple electron boilerplate that has already implemented all things like the tray icon, a builder and reloading the main process. Additionally it should have as few dependencies as possible. I didn't really find what I was looking for, so I built this little starter kit.

Features

• Tray-Icon support
• TypeScript main process
• Yarn workspaces (https://classic.yarnpkg.com/en/docs/workspaces)
• electron-builder
• Auto reloading main process
• A small plugin to set window size inside the vue files
  • src/main/src/index.js | Start at line 48
  • src/renderer/src/main.js | Start at line 12

Structure

├── app/
│   └── resources/ # resources like the tray icon image
│
├── build/
│   └── icons/ # application icon
│
├── src/
│   ├── renderer/ # renderer process (e.g. react, vue, angular, svelte etc.)
│   └── main/ # main process
│   │   ├── src/ # all main files
│   │   └── types/ # additional typing informations
│
├── .gitignore
├── package.json
└── README.md

Renderer

You can also use any other framework/library, if you like

• Vue (created with the vue CLI)
  • Vuex store
    • Persisted start
  • Router
• Context menu

Commands

Install all packages and add/delete specific package

yarn install # install packages

yarn workspace main add PACKAGE # install specific package for main process

yarn workspace renderer add PACKAGE # install specific package for render process

yarn workspace renderer remove PACKAGE # remove specific package from renderer process

Run in dev mode

yarn start

Build source code only

yarn build

Build app with electron-builder

yarn build:app # Builds executable directly.

yarn build:all # Build all. Linux, Windows and Mac.

yarn build:mac # Build Mac

yarn build:linux # Build Linux

yarn build:windows # Build Windows