Vue+Electron学习系列 (一)

Vue+Electron学习系列

​​​​​​​1️⃣Vue+Electron学习系列 (一) -- 初识​​​​​​​

2️⃣ Vue+Electron学习系列 (二) -- 打包发布

3️⃣ Vue+Electron学习系列 (三) -- 自动更新

4️⃣ Vue+Electron学习系列 (四) -- 自动更新进阶

---

​​​​​​​提示：环境搭建

环境准备

# node 
# node安装后自带npm,如果npm安装依赖慢，可设置淘宝的镜像仓库
npm config set registry http://registry.npm.taobao.org

# 也可选择yarn作为包管理工具
npm install -g yarn

# 基础命令
yarn global add | remove...

#安装vue-cli：vue-cli高版本更名为@vue/cli
#防止安装vue-cli后无法使用vue无效，可先删除低版本vue-cli,然后添加环境变量
yarn global add @vue/cli

vue-cli创建初始化项目

vue creat demo

项目内集成Electron

# 在项目根目录下安装 vue-cli-plugin-electron-builder插件
vue add electron-builder

# 安装过程中会提示选择electron版本,一般默认的版本都是比较低的，在安装完成后
# 自行更新一下electron版本即可
yarn add electron@10.1.1 -D

本地运行

# electron启动项目命令
yarn electron:serve

# electron打包项目命令
yarn electron:build

# vue启动项目命令
yarn serve

# vue打包项目命令
yarn build