2024-08-15 13:58:49 +08:00
|
|
|
# surl front
|
2024-07-28 23:29:47 +08:00
|
|
|
|
2024-08-15 13:58:49 +08:00
|
|
|
短链接生成系统， 基于`Vue3`的前端
|
2024-07-28 23:29:47 +08:00
|
|
|
|
2024-08-15 14:02:32 +08:00
|
|
|
## 技术栈介绍
|
|
|
|
|
|
|
|
|
|
- 前端框架：`Vue3`
|
|
|
|
|
- 前端构建工具：`Vite`
|
|
|
|
|
- 使用的脚本语言：`TypeScript`
|
|
|
|
|
- 状态管理：`pinia`
|
|
|
|
|
- 路由管理：`Vue-router`
|
|
|
|
|
- 组件框架：`Vuetify`
|
|
|
|
|
|
2024-08-15 13:58:49 +08:00
|
|
|
## 配置项
|
|
|
|
|
|
|
|
|
|
### 配置后端接口信息
|
|
|
|
|
|
2024-08-20 14:29:43 +08:00
|
|
|
配置`.env`环境变量
|
2024-08-15 13:58:49 +08:00
|
|
|
|
2024-08-20 14:29:43 +08:00
|
|
|
- `VITE_PROTOCOL` 协议，可选`http`、`https`
|
|
|
|
|
- `VITE_HOST` 主机+端口号
|
2024-08-20 14:37:18 +08:00
|
|
|
- `VITE_LOCALE` 语言，可选`zhHans`、`en`
|
2024-08-15 13:58:49 +08:00
|
|
|
|
|
|
|
|
## 部署
|
|
|
|
|
|
|
|
|
|
### 容器部署
|
|
|
|
|
|
|
|
|
|
1. 准备`docker`、`docker compose`环境
|
|
|
|
|
2. 按需修改 nginx.conf
|
2024-08-22 13:34:57 +08:00
|
|
|
3. 修改`.env`配置文件
|
|
|
|
|
4. 运行`npm run build`执行页面构建
|
|
|
|
|
5. 运行 `docker compose up -d` 启动容器即可
|
2024-08-15 13:58:49 +08:00
|
|
|
|
|
|
|
|
### 本地部署
|
|
|
|
|
|
|
|
|
|
1. 安装依赖
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
sudo apt install nodejs npm nginx
|
|
|
|
|
npm install
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
2. 配置nginx
|
|
|
|
|
|
|
|
|
|
- 按需修改`nginx.conf`，并复制到`/etc/nginx/sites-enabled/default`
|
|
|
|
|
- 运行`sudo nginx -t`检查配置
|
|
|
|
|
- 执行编译 `npm run build`
|
|
|
|
|
- 将`dist`下的内容复制到`/usr/share/nginx/html`
|
|
|
|
|
- 运行`sudo nginx -s reload`
|
