Electron

Electron

github地址

electron是一个使用javascript为基础的前端技术栈开发跨平台桌面应用的框架，利用这个框架我们可以快速开发多个平台的桌面应用。值得提出的是，electron是github开发的。最早运用在atom编辑器中，后来的微软开发的vs code也是使用的electron。

入门感知

electron-quick-start

官方提供了一个快速入门的代码示例。

git clone https://github.com/electron/electron-quick-start
cd electron-quick-start
npm install
npm start

运行上述命令之后，我们可以看到弹出了一个窗体，显示了HelloWorld。

electron-vue

electron-vue是社区开源的一套使用vue.js和electron开发桌面应用的技术方案。

github地址

使用

vue init simulatedgreg/electron-vue electron-vue-demo
cd electron-vue-demo
cnpm install
cnpm run dev

运行起来之后，会启动一个应用窗口。

分析项目的目录结构，是一个非常标准的vue.js项目，集成了vue-router，vuex生态库。

我们尝试修改代码：

• 删除components下的目录及文件，新建Home.vue
• router index.js 做相应修改

再次启动后，可以看到修改后Home.vue中的内容。

打包

尝试在mac OS平台上生成应用的dmg文件。

非常简单，使用如下命令：

cnpm run build

在build文件夹中，可以看到electron-vue-demo-0.0.0.dmg。

在mac OS可以按照正常步骤按照这个dmg。