1.node.js 安装好的情况下 安装脚手架vue-cli
npm install -g @vue/cli (安装失败的话给"
@vue/cli" 加上引号试试
)
2.创建项目
vue create 项目名 (然后是一堆英文选项是否生成router之类的。参考下面博客)
3.进入项目根目录(electron-vue-helloworld),然后执行下列命令:
vue add electron-builder
这个时候会安装electron-builder的依赖,可能比较耗费时间,请大家耐心等待,安装完成后会出现以下选型:
? Choose Electron Version (Use arrow keys)
^4.0.0
^5.0.0
❯ ^6.0.0
这一步是选择Electron的版本,我们这里选择最新版本6.0.0,等待安装完成即可。安装完成后会在src目录下生成background.js,并在package.json 文件中修main为"main": "background.js"
至此,所有的安装都已经完成了,接下来我们就可以运行程序看效果了。
注:这些安装可能会失败,请再执行一次。(我第一次装都没成功)
4.执行以下命令,运行程序
npm run electron:serve
在启动的时候,会启动很久,并出现以下信息
INFO Launching Electron...
Failed to fetch extension, trying 4 more times
Failed to fetch extension, trying 3 more times
Failed to fetch extension, trying 2 more times
Failed to fetch extension, trying 1 more times
这是在安装vuejs devtools,由于网络问题,一直安装不上。重试5次之后就会自动跳过并且启动程序。
编译成功后,会自动弹出一个桌面程序,如下图所示
参考链接:https://www.cnblogs.com/ippcode/p/12424826.html