vue-electron 脚手架安装及说明

摘要： 最近因为公司需求，在学习用electron开发桌面应用，因为之前一直用vue做项目，然后发现一个融合了vue-cli+electron的一种新的脚手架，省去许多繁琐配置，即vue-...

最近因为公司需求，在学习用electron开发桌面应用，因为之前一直用vue做项目，然后发现一个融合了vue-cli+electron的一种新的脚手架，省去许多繁琐配置，即vue-electron。

接着呢就说明一下安装和使用，首先你的电脑需要安装有nodeJs，并且全局装有vue-cli，如果没有装，就打开shellpower输入：

npm install --global vue-cli

按回车进行全局安装。

1、安装

新建文件夹，cd 到你将要安装的文件夹目录；

vue init simulatedgreg/electron-vue

接下来的步骤跟安装vue-cli很是相似

选择Y或Enter即可

2、npm install

这一步主要是安装依赖，耗时有点久。完毕后项目内多了node_modules 文件夹。

3、npm run dev

4、打包

先看看项目package.json文件截图：

scripts内各种打包命令，其中就包括Mac、Windows、Linux三大平台。例如我想在Mac上打包运行，$npm run build:darwin  就会在项目的build文件夹下生成一个应用程序，以此类推，，，$npm run build:win32 等

vue-electron脚手架最大好处就是我们不要在Vue项目里手动配置electron了，极好的融合了Vue-cli+electron ,省去开发者大把时间去配置。

另外不得不说一下，vue-electron主要业务逻辑都放在了src->renderer文件夹内去写，和之前的vue-cli搭建项目可以说是没有任何区别！