electron打包vue-cli项目为桌面程序（一）：vue-cli创建webpack项目

一：安装node环境

1：Node.js 官方网站下载：https://nodejs.org/en/

选择相应的安装包下载并安装。

安装成功后查看版本号。

2：安装vue脚手架vue-cli

npm install vue-cli -g

3：使用vue-cli初始化一个webpack项目

vue init webpack studyelectron（自定义的项目名称）

创建项目过程中有些项目信息需要确认，回车进行确认

安装过程中提示项目创建后是否自动使用npm安装依赖，可以直接回车使用npm自动安装依赖。

也可以选择自己安装，由于npm安装依赖时速度比较慢可能安装时间较长或安装失败，也可以选择自己使用cnpm进行安装。

4：项目创建成功后，如果没有使用npm自动安装依赖，可以安装cnpm后安装依赖

npm install -g cnpm --registry=https://registry.npm.taobao.org

安装cnpm后，进入项目文件夹

cd studyelectron

使用cnpm安装依赖项

cnpm install

等待几分钟后，项目依赖项安装完成，查看项目目录结构

下一章具体讲解项目的目录结构

5：运行项目开发环境

npm run dev

运行成功，在浏览器中输入http://localhost:8080进行查看

 

下一章具体讲解项目的目录结构