vue3 项目中集成 Electron

发布于 1 年前 作者 phonegap100 1202 次浏览 最后一次编辑是 1 年前 来自 分享

准备工作:电脑上面安装nodejs(nodejs用16.x或者16.x之前的版本) 、安装 yarn

注意: 1、nodejs用16.x或者16.x之前的版本 2、安装vue/cli@4.5.4的版本

1、安装Vue脚手架

cnpm install -g @vue/cli@4.5.4

2、创建项目

vue create electron-vue3
cd electron-vue3
yarn serve

3、在创建vue3的项目中集成Electron 安装模块

https://nklayman.github.io/vue-cli-plugin-electron-builder/guide/#installation

vue add electron-builder

4、运行项目

yarn electron:serve
或	
npm run electron:serve

5、打包项目

yarn electron:build
或	
npm run electron:build

6、可能遇到的错误

如果最后一步提示

error E:\theia\node_modules\electron: Command failed.
Exit code: 1
Command: node install.js

看错误描述应该是网络异常,因为我的是在公司起的项目,有可能做了代理屏蔽,所以大概率是镜像问题,但是我自己重新试试挂载淘宝的NPM的镜像,同样异常。经过一番查找发现了有人也出现类似的问题,这里地址:解决安装electron卡在node install.js 不动问题

解决方法: 终端执行

 npm config set electron_mirror https://npm.taobao.org/mirrors/electron/  

然后重新执行vue add electron-builder命令 就能正常运行了

回到顶部