第一步：检查并安装脚手架

安装vue脚手架

第二步：打开vue项目管理器

使用 vue ui 打开vue项目管理器，出现如下图代表安装成功！
image.png

第三步：创建新项目

  1. 输入项目名后点击下一步

image.png

  1. 选择手动配置项目

image.png

  1. 在默认选择上再勾选如图三个选项

image.png

  1. 分别选择如图两个选项

image.png

  1. 点击创建项目
  2. 选择创建项目，不保存预设

image.png

  1. 进入该页面代表创建完毕

image.png

第四步： 安装插件

  1. 点击插件菜单，后点击添加插件按钮

image.png

  1. 在搜索栏输入 electron ，然后选择 vue-cli-plugin-electron-builder 插件，并点击安装该插件。

image.png

  1. 点击完成安装

image.png

  1. 点击继续

image.png

  1. 出现如下画面代表electron-vue安装完毕。

    第五步：运行

    在菜单栏选择任务，点击electron:serve，最后点击运行即可运行我们的electron程序！
    image.png
    出现如下画面代表完美成功！大功告成！
    image.png