# Electron-ui5.x

**Repository Path**: jia_chen_feng/electron-vue-vite

## Basic Information

- **Project Name**: Electron-ui5.x
- **Description**: 桌面端支持windows,macos,linux，基于electron,vue3,ts,vite,pinia,elementUIPlus,sse,websocket。整合ruoyi-vue-plus后端
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 2
- **Created**: 2025-02-12
- **Last Updated**: 2025-09-01

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Electron模板

相关配置:

- [VITE5](https://www.vitejs.net/) + [ELECTRON](https://www.electronjs.org/zh/docs/latest/) + [VUE3](https://v3.cn.vuejs.org/guide/introduction.html#%E8%B5%B7%E6%AD%A5) + [ELEMENT-PLUS](https://element-plus.org/zh-CN/component/button.html) + [VUE-ROUTER](https://router.vuejs.org/zh/introduction.html) + [PINIA](https://pinia.web3doc.top/)

#### 架构

- 技术栈采用了 electron + vue3 + vite5 + TS + pinia + element-plus + vue-router + axios


#### 使用说明

- 框架基于 Vue3 `<script setup lang='ts'>` 写法;
- 项目 node 以及 npm 版本,搭建环境为 node v20.18.0 npm v10.9.0;
- 可用于学习与交流;
- 如发现问题或建议可在评论区留言, 看到会及时处理;
- 如有需求亦可在评论区留言,或自行在此项目基础上增加;
- 该项目为初始框架未开发任何业务,可自行开发;
- 喜欢就点个star吧!

### 目录结构

```shell

├─ resources                # 静态资源
├─ src                      # 项目源码
│   ├─ main                 # 主进程
│   ├─ preload              # 预加载进程
│   └─ renderer             # 渲染进程
│       └─ src              # 页面源码
│           ├─ api          # 接口文件
│           ├─ assets       # 静态资源
│           ├─ components   # 组件
│           ├─ enums        # 枚举 
│           ├─ lang         # 国际化文件
│           ├─ layout       # 布局  
│           ├─ plugins      # 插件 
│           ├─ types        # 类型声明 
│           ├─ router       # 路由
│           ├─ store        # 全局状态管理
│           ├─ utils        # 工具函数
│           └─ views        # 页面
└─ # 其他配置文件

```

### 下载依赖

```bash
$ npm install --registry=https://registry.npmmirror.com
```

### 运行

#### 开发环境

```bash
$ npm run dev
```

#### 生产环境

```bash
$ npm run start
```

### 打包

#### 打包前请删除 dist 文件夹

```bash
# For windows
$ npm run build:win

# For macOS
$ npm run build:mac

# For Linux
$ npm run build:linux
```

### 备注

#### 编写跳转页面时,在路径前面添加一个'#'

##### 示例

```bash
location.href = '#/login'
```

##### 项目配置了vue-router,也可以使用如下方式跳转

```bash
const router = useRouter()
router.push('/login')
```