前面讲了如何创建 Electron 项目,使用 web 前端作为我们应用的 UI,不过我们的目标是做一个 Electron-Vue 的项目,也就是说前端部分采用 Vue 框架来做。
下面是具体步骤:
-
首先,全局安装 vue-cli,如果已经安装过,则跳过。
npm install vue-cli -g
在本地创建一个空文件夹(作为工程目录),使用命令行窗口打开该目录。
-
执行初始化 electron-vue 命令。
vue init simulatedgreg/electron-vue my-project
初始化过程中会让填很多参数配置,我填的参数如下,大家也可以自行调整设置:
-
初始化完以后, cd 命令进入 my-project 文件夹(上一步创建的项目文件夹),执行以下命令
npm install
如果网不稳定的话,可以执行 cnpm install 代替。
-
安装好之后,执行 npm run dev 命令启动运行程序。
npm run dev
经过一系列的编译,第一个 electron-vue 程序就运行起来了。