Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ci010/electron-vue-next
A starter template for using vue-next with the electron.
https://github.com/ci010/electron-vue-next
boilerplate electron electron-vue esbuild rollup vite vue vue-next vue-router vuex
Last synced: 3 months ago
JSON representation
A starter template for using vue-next with the electron.
- Host: GitHub
- URL: https://github.com/ci010/electron-vue-next
- Owner: ci010
- Created: 2020-10-19T17:02:53.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2021-09-06T18:14:06.000Z (almost 3 years ago)
- Last Synced: 2024-01-22T12:25:05.893Z (5 months ago)
- Topics: boilerplate, electron, electron-vue, esbuild, rollup, vite, vue, vue-next, vue-router, vuex
- Language: JavaScript
- Homepage: https://ci010.github.io/electron-vue-next/
- Size: 1.73 MB
- Stars: 191
- Watchers: 5
- Forks: 26
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
Lists
- awesome-stars - ci010/electron-vue-next - A starter template for using vue-next with the electron. (JavaScript)
README
# Overview
This repository contains the starter template for using vue-next with the latest electron.
*I started to learn electron & vue by the great project [electron-vue](https://github.com/SimulatedGREG/electron-vue). This project is also inspired from it.*
You can see the document [here](https://ci010.github.io/electron-vue-next/index.html).
同样，我们也有[中文文档](https://ci010.github.io/electron-vue-next/zh)。
## Features
- Electron 11
- Follow the [security](https://www.electronjs.org/docs/tutorial/security) guide of electron, make renderer process a browser only environment
- Using [electron-builder](https://github.com/electron-userland/electron-builder) to build
- Empower [vue-next](https://github.com/vuejs/vue-next) and its eco-system
- Using [vite](https://github.com/vitejs/vite) which means develop renderer process can be blazingly fast!
- Using [vuex 4.0](https://github.com/vuejs/vuex/tree/4.0) with strong type state, getters, and commit
- Using [vue-router-next](https://github.com/vuejs/vue-router-next)
- Using [eslint](https://www.npmjs.com/package/eslint) with Javascript Standard by default
- Built-in TypeScript Support
- Using [esbuild](https://github.com/evanw/esbuild) in [rollup](https://github.com/rollup/rollup) (align with vite) to build main process typescript code
- Github Action with Github Release is out-of-box
- Auto bump version in package.json and generate CHANGELOG.md if you follow the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0)
- Detail how this work described in [Release Process](#release-process) section
- Integrate VSCode well
- Support debug .ts/.vue files in main/renderer process by vscode debugger
- Detail see [Debug](#debug-in-vscode) section
- Multiple Windows Support
- Can add a new window for App easily. See [Add a New Window](#new-window) section
- [vue-devtool](https://github.com/vuejs/vue-devtools) support
- Run npm run postinstall to install extensions
- Support vue-router-next and vuex 4 with new UI
## Getting Started
Run `npm init electron-vue-next `
Once you have your project, and in the project folder:
```shell
# Install dependencies with linter
npm install
# Will start vite server, rollup devserver, and electron to dev!
npm run dev
# OPTIONAL. Will compile the main and renderer process to javascript and display output size
npm run build
# OPTIONAL. Will compile all and output an unpacked electron app. You can directly
npm run build:dir
# Will compile all and build all products and ready to release
npm run build:production
```