# future-electron

**Repository Path**: star45/future-electron

## Basic Information

- **Project Name**: future-electron
- **Description**: 基于electron+vue2+elementUI快速开发桌面应用，功能完善，可作为脚手架快速快发。支持最新版本electron，集成了electron必要的组件支持。该项目工程模板使用electron-vue构建，页面模板采用了vue-element-admin。项目实现了程序自动更新；对配置文件的读写操作；基于lowdb实现了本地数据库的curd。
- **Primary Language**: JavaScript
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 4
- **Forks**: 1
- **Created**: 2022-04-04
- **Last Updated**: 2025-06-21

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# future-electron

<p>
  <a href="https://github.com" target="_blank">
    <img src="https://img.shields.io/badge/build-success-green" alt="BUILD">
  </a>
  <a href="https://github.com/" target="_blank">
    <img src="https://img.shields.io/badge/version-last-blue" alt="VERSION">
  </a>
  <a href="https://github.com/" target="_blank">
    <img src="https://img.shields.io/badge/license-MIT-blue" alt="LICENSE">
  </a>
    <a href="https://github.com/" target="_blank">
    <img src="https://img.shields.io/badge/node-v14.18.1-blue" alt="NODE">
  </a>
    <a href="https://github.com/" target="_blank">
    <img src="https://img.shields.io/badge/platform-Windows%20%7C%20MacOS%20%7C%20Linux-brightgreen" alt="PLATFORM">
  </a>
</p>

> future系列之electron，基于electron+elementUI快速开发桌面应用。支持最新版本electron（目前官方最新版本**18.0.3**），集成了一些electron相关的组件支持，例如：
- "devtron": "^1.4.0",                     官方 DevTools 扩展。
- "electron-builder": "^23.0.3",           构建安装程序
- "electron-debug": "^1.5.0",              添加有用的调试功能
- "electron-devtools-installer": "^3.2.0", 从 Chrome 网上应用店安装 DevTools 扩展。
- "electron-better-ipc": "^2.0.1",         简化的 IPC 通信。
- "electron-log": "^4.2.2",                简单的日志记录
- "electron-store": "^8.0.1",              保存和加载数据，如用户偏好、应用程序状态、缓存等。
- "electron-updater": "^5.0.1",            利用 npm 部署更新的自动更新程序
- "electron-util": "^0.17.2",              用于开发应用程序和模块的有用实用程序。
- "about-window": "^1.15.2",               快速创建“关于这个应用程序”窗口。

该项目工程模板使用electron-vue构建，页面模板采用了vue-element-admin。基于electron-updater实现了程序自动更新，基于electron-store实现了对配置文件的读写操作，基于lowdb实现了本地数据库的curd。

Electron
--------

<table>
    <tr height=240>
        <td>
            <a href="https://github.com/alrra/browser-logos/tree/a94987f29719142668cdf960b3f624ce1a3c6aa8/src/electron">
                <img width=230 src="https://raw.githubusercontent.com/alrra/browser-logos/a94987f29719142668cdf960b3f624ce1a3c6aa8/src/electron/electron.svg?sanitize=true" alt="Electron browser logo">
            </a>
        </td>
    </tr>
</table>

#### 快速上手

```bash
git clone https://gitee.com/star45/future-electron.git

# 进入项目目录
cd future-electron

```

#### 构建

``` bash
# install dependencies
# 建议不要直接使用 cnpm 安装依赖，会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org

# serve with hot reload at localhost:9080
npm run dev

# build electron application for production
npm run build


# lint all JS/Vue component files in `src/`
npm run lint

```

---

#### 打包
```bash
# 打包时，package.json中build.productName包名不要为中文，避免一些未知异常

# 打包 （windows版本）
npm run build-w (32位)
npm run build-w-64 (64位)

# 打包 （mac版本）
npm run build-m
npm run build-m-arm64 (m1芯片架构)

# 打包 （linux版本）
npm run build-l

# 如果执行了代码压缩命令，打包完成后，记得还原代码
npm run restore

```

### 本地启动

- 执行 yarn run dev

![启动命名](https://gitee.com/star45/future-common/raw/master/gl1946pjxe1649992723441.png)

### 预览
> 点开看大图
<table>
    <tr>
        <td style="border:5px"><img src="https://gitee.com/star45/future-common/raw/master/6h9udumplc1649993064378.png" width="300" height="300"/></td>
        <td style="border:5px"><img src="https://gitee.com/star45/future-common/raw/master/e2hkd003i81649993082930.png" width="300" height="300"/></td>
    </tr>
    <tr>
        <td style="border:5px"><img src="https://gitee.com/star45/future-common/raw/master/ovdtp3nnsm1649993135245.png" width="300" height="300"/></td>
        <td style="border:5px"><img src="https://gitee.com/star45/future-common/raw/master/gant6dr28g1650002595955.png" width="300" height="300"/></td>
    </tr>    
</table>


![更新日志](https://gitee.com/star45/future-common/raw/master/wxeh64n2zg1650352162487.png)