项目简介

一个入门简单、跨平台的开源免费桌面软件开发框架。

特性

1. 跨平台：一套代码，可以打包成windows版、Mac版、Linux版
2. 简单高效：只需学习 js 语言，同时支持vue、react、html等前端技术
3. 前端独立：理论上支持任何前端技术，编写出精美的UI效果
4. 工程化：可以用服务端的开发思维，来编写桌面软件
5. 高性能：事件驱动、非阻塞式IO
6. 功能丰富：前端、服务端的技术场景等
7. 功能demo：桌面软件常见功能，后续逐步集成或提供demo
8. 开源免费：数万下载量，数百家中小企业在使用

使用场景

1. 常规桌面软件

windows平台，macOS平台，linux平台 (ubuntu)

2. vue、react、angular、web 转换成桌面软件

vue-ant-design（本地），禅道项目管理（web项目地址），

3. 游戏（h5相关技术开发）

快速入门

electron-egg采用electron+node语言开发，前端几面可以用vue、react、angular等，所以需要提前安装node，npm等工具，为了顺利下载依赖，可将npm镜像设置为淘宝镜像。

1. 下载源码

使用git命令从gitee下载源码或者下载zip包解压。

git clone https://gitee.com/wallace5303/electron-egg.git

目录结构如下图所示

2.安装依赖

npm install

3.配置

依赖包准备完成后，开始配置程序。有几种模式运行程序，具体可查看package.json文件，这里我们选择开发者模式，打开配置文件：electron-egg/electron/config.js，可修改如下配置：

config.js

  developmentMode: {
    default: 'vue', // 默认前后端分离，使用vue
    mode: {
    	// 前后端分离，使用vue开发，端口与vue启动的serve一致
      vue: {
        hostname: 'localhost',
        port: 8080
      },
      // 前后端分离，使用react开发，端口与react启动的serve一致
      react: {
        hostname: 'localhost',
        port: 3000
      },
      // ejs模板渲染
      ejs: {
        hostname: 'localhost',
        port: 7068 // The same as the egg port
      }
    }
  },

4.启动/运行

这里我们采用vue模式来运行。

# 1：【进入前端目录】，启动vue
cd electron-egg/frontend
npm run serve

# 2：【根目录】，启动electron服务
npm run dev

5.编写一个api，供前端使用

1）创建路由，在electron-egg/app/router/index.js文件中，添加：

router.get('/hello', controller.v1.home.hello);

2）在控制器层中（electron-egg/app/controller/v1/home.js），编写方法

  async hello() {
    const { ctx, service } = this;

    const data = {
      title: 'hello'
    };

   this.sendSuccess(data);
  }

3）访问api

http://localhost:7068/hello

具体可参考官方文档：https://www.yuque.com/u34495/mivcfg/xnhmms

用户案例