Awesome Open Source
Awesome Open Source

Vue-Electron-Template

Build Status Build status All Contributors

Template for building desktop applications using Electronjs and Vue.js

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

Project structure

src/main contains electron main script.

src/renderer contains vue-js application.

src/utilities/workerSample.ts a sample worker script.

Credits

All credits to authors of packages and tools used in the project.

* This template is inspired by electron-vue

Contributors

Thanks goes to these wonderful people (emoji key):


Jibbie R. Eguna

🎨

eiurur

💻

This project follows the all-contributors specification. Contributions of any kind welcome!


Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (70,419
vue (4,293
webpack (1,158
electron (958
boilerplate (639
starter (147
webpack4 (109
rollup (81
bulma (73
starter-template (72
electron-vue (36
electronjs (31