Skip to content
An Electron & Vue.js template with Hot-reloading enabled and common Vue plugins, dev, debug and build scripts configured.
JavaScript CSS Vue HTML HCL
Branch: master
Clone or download
mubaidr Merge pull request #508 from mubaidr/dependabot/npm_and_yarn/url-load…
…er-3.0.0

Bump url-loader from 2.3.0 to 3.0.0
Latest commit f6173d2 Dec 4, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github
.vscode update template Jun 27, 2019
_icons [ImgBot] Optimize images Oct 31, 2019
_scripts update build scripts Nov 13, 2019
src update build scripts Nov 13, 2019
static add template Apr 30, 2018
.all-contributorsrc docs: create .all-contributorsrc Feb 21, 2019
.babelrc update template Jun 27, 2019
.editorconfig add template Apr 30, 2018
.eslintignore
.eslintrc.js update template Jun 27, 2019
.gitignore update template Jun 27, 2019
.prettierrc update template Jun 27, 2019
.travis.yml add workers, toasted, scripts updated Jun 29, 2019
.whitesource Initial WhiteSource configuration file Feb 11, 2019
LICENSE
README.md update readme Oct 31, 2019
appveyor.yml add workers, toasted, scripts updated Jun 29, 2019
package-lock.json Merge pull request #508 from mubaidr/dependabot/npm_and_yarn/url-load… Dec 4, 2019
package.json Merge pull request #508 from mubaidr/dependabot/npm_and_yarn/url-load… Dec 4, 2019
screenshot.png [ImgBot] Optimize images Oct 31, 2019
tsconfig.json

README.md

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-4 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-Pro, 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
  • 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
  • Installed vue-devtools and devtron tools for development
  • DEV, DEBUG & BUILD NPM scripts
  • --debug paramter to enable dev tools in build executeable
  • Babel configured
  • ESLint configured
  • vscode debug config for renderer process debugging
  • Process restarting when working in main process & hot module replacement for renderer.

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
Jibbie R. Eguna

🎨

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

You can’t perform that action at this time.