201 lines
3.5 KiB
Markdown
201 lines
3.5 KiB
Markdown
# JNote-UI 打包部署文档
|
||
|
||
## 项目结构
|
||
|
||
```
|
||
jnote-ui/
|
||
├── src/ # 前端源代码
|
||
├── dist/ # 前端构建产物
|
||
├── server/ # 后端服务
|
||
│ ├── src/
|
||
│ │ ├── index.js # 后端入口
|
||
│ │ ├── config/ # 配置文件
|
||
│ │ └── routes/ # 路由
|
||
│ ├── build.js # 打包脚本
|
||
│ ├── package.js # 分发包打包脚本
|
||
│ ├── start.js # 启动脚本
|
||
│ ├── .env # 环境配置
|
||
│ └── package.json
|
||
└── package.json # 前端依赖
|
||
```
|
||
|
||
---
|
||
|
||
## 一、打包前端
|
||
|
||
```bash
|
||
npm install
|
||
npm run build
|
||
```
|
||
|
||
构建完成后会生成 `dist/` 目录。
|
||
|
||
---
|
||
|
||
## 二、打包后端
|
||
|
||
### 方式一：快速打包（生成可执行文件）
|
||
|
||
```bash
|
||
cd server
|
||
|
||
# 安装依赖
|
||
npm install
|
||
|
||
# 打包 Linux 和 Windows 两个版本
|
||
node package.js
|
||
```
|
||
|
||
打包完成后会生成 `server/release/` 目录：
|
||
|
||
```
|
||
release/
|
||
├── README.txt
|
||
├── linux/
|
||
│ ├── jnote-api # Linux 可执行文件
|
||
│ ├── start.js # 启动脚本
|
||
│ └── .env # 环境配置
|
||
└── windows/
|
||
├── jnote-api.exe # Windows 可执行文件
|
||
├── start.js # 启动脚本
|
||
└── .env # 环境配置
|
||
```
|
||
|
||
### 方式二：仅打包 Linux 版本
|
||
|
||
```bash
|
||
cd server
|
||
node build.js
|
||
```
|
||
|
||
---
|
||
|
||
## 三、部署后端
|
||
|
||
### Linux 服务器部署
|
||
|
||
将 `release/linux/` 目录上传到服务器：
|
||
|
||
```bash
|
||
# 上传
|
||
scp -r release/linux/ user@your-server:/path/to/jnote/
|
||
|
||
# SSH 登录后
|
||
cd /path/to/jnote
|
||
chmod +x jnote-api start.js
|
||
./start.js
|
||
```
|
||
|
||
### Windows 服务器部署
|
||
|
||
将 `release/windows/` 目录上传到服务器：
|
||
|
||
```powershell
|
||
cd windows
|
||
node start.js
|
||
```
|
||
|
||
---
|
||
|
||
## 四、配置 Nginx
|
||
|
||
后端 API 默认运行在 `http://localhost:3000`，前端静态文件通过 Nginx 提供。
|
||
|
||
### Nginx 配置示例
|
||
|
||
```nginx
|
||
server {
|
||
listen 80;
|
||
server_name 你的域名或IP;
|
||
|
||
# 前端静态文件
|
||
root /path/to/jnote-ui/dist;
|
||
index index.html;
|
||
|
||
# 前端路由（SPA）
|
||
location / {
|
||
try_files $uri $uri/ /index.html;
|
||
}
|
||
|
||
# API 反向代理
|
||
location /api/ {
|
||
proxy_pass http://127.0.0.1:3000;
|
||
proxy_http_version 1.1;
|
||
proxy_set_header Upgrade $http_upgrade;
|
||
proxy_set_header Connection 'upgrade';
|
||
proxy_set_header Host $host;
|
||
proxy_cache_bypass $http_upgrade;
|
||
}
|
||
}
|
||
```
|
||
|
||
---
|
||
|
||
## 五、常用命令汇总
|
||
|
||
```bash
|
||
# 1. 构建前端
|
||
npm install
|
||
npm run build
|
||
|
||
# 2. 打包后端（Windows/Linux 双版本）
|
||
cd server
|
||
npm install
|
||
node package.js
|
||
|
||
# 3. 上传 release/linux/ 到服务器后启动
|
||
chmod +x jnote-api start.js
|
||
./start.js
|
||
|
||
# 4. PM2 管理（可选）
|
||
pm2 start jnote-api --name jnote-api
|
||
pm2 save
|
||
pm2 startup
|
||
|
||
# 5. PM2 常用命令
|
||
pm2 status # 查看状态
|
||
pm2 logs jnote-api # 查看日志
|
||
pm2 restart jnote-api # 重启
|
||
pm2 stop jnote-api # 停止
|
||
```
|
||
|
||
---
|
||
|
||
## 六、端口配置说明
|
||
|
||
### 后端端口
|
||
|
||
在 `server/.env` 中配置：
|
||
```env
|
||
PORT=3000
|
||
```
|
||
|
||
### 前端代理端口
|
||
|
||
在 `jnote-ui/.env` 中配置（与 server/.env 的 PORT 保持一致）：
|
||
```env
|
||
VITE_API_PORT=3000
|
||
```
|
||
|
||
如果后端端口改变，必须同时修改这两个文件。
|
||
|
||
---
|
||
|
||
## 七、更新部署
|
||
|
||
```bash
|
||
# 1. 拉取最新代码
|
||
git pull
|
||
|
||
# 2. 重新构建前端
|
||
npm run build
|
||
|
||
# 3. 重新打包后端
|
||
cd server
|
||
node package.js
|
||
|
||
# 4. 上传新的 release/ 目录到服务器
|
||
|
||
# 5. 重启后端
|
||
pm2 restart jnote-api
|
||
``` |