typescript+vue+node项目打包部署

部署 TypeScript + Vue + Node.js 项目的步骤

前端 Vue 部分打包

确保前端项目根目录下已安装依赖，运行以下命令生成静态文件：

npm run build

默认输出目录为 dist/，包含 HTML、CSS、JS 等静态资源。

后端 Node.js 部分构建

在 Node.js 项目根目录下，编译 TypeScript 代码为 JavaScript：

npx tsc

或通过 tsconfig.json 配置自定义输出目录（如 build/）。
确保生产环境依赖已安装：

npm install --production

服务器配置

将前端静态文件（dist/）和后端构建产物（如 build/）上传至服务器。
推荐使用 PM2 管理 Node.js 进程：

pm2 start build/index.js --name "your-app"

配置 Nginx 代理前端请求和后端 API：

server {listen 80;server_name your-domain.com;location / {root /path/to/dist;try_files $uri $uri/ /index.html;}location /api {proxy_pass http://localhost:3000;proxy_set_header Host $host;}
}

环境变量处理

前端环境变量需在构建时通过 .env.production 文件注入：

VUE_APP_API_URL=https://your-api-domain.com

后端环境变量可通过 .env 文件或系统环境变量加载，推荐使用 dotenv 库。

自动化部署（可选）

使用 CI/CD 工具如 GitHub Actions、Jenkins 或 Docker 容器化部署。
示例 Dockerfile 片段：

# 前端构建
FROM node:16 as frontend
WORKDIR /app
COPY frontend/ .
RUN npm install && npm run build# 后端运行
FROM node:16
WORKDIR /app
COPY backend/ .
COPY --from=frontend /app/dist ./public
RUN npm install --production
EXPOSE 3000
CMD ["node", "build/index.js"]