Vue-Electron-Template

Template for building desktop applications using Electronjs and Vue.js

NOTICE

Overview

This template takes advantage of webpack-5 with vue-loader, electron-builder, and some of the most used plugins like vue-router, vuex and so much more to provide an easy to use development (with vscode debugging) enviroment with hot module replacement.

Features

Bulma-Fluent, a theme suitable for desktop application based on Bulma
vue-router
vuex
vue-electron
material-design-icons installed
Some built-in animaitons animations.scss
SCSS/SASS support with vue-loader (removes unused css/styles during build)
Typescript support (for Vuejs as well)
Worker scripts (to perform CPU-intensive operations), to use with nodejs child_process module. Sample Worker File
Easily package your electron app using electron-builder
vue-devtools installed
DEV, DEBUG & BUILD NPM scripts
Babel configured
ESLint configured
vscode debug config for renderer process debugging
Process restarting when working in main process & hot module replacement for renderer
Generates web/browser build in the dist/web directory too
--debug paramter to enable dev tools in production build executeable

Screenshot

Getting Started

Clone this repository, install dependencies and run using either dev, debug or build command.

# Clone this repository
git clone https://github.com/mubaidr/vue-electron

# change directory to cloned path
cd vue-electron

# Install dependencies
npm install

# Run in `debug` mode, to debug app using VSCODE
npm run debug

# Run in `dev` mode
npm run dev

# Build installer for this app
npm run build