阿里云 django+vue前后端分离 前端打包上传

0 环境

• 服务器：阿里云
• 服务器操作系统：centos
• ssh ：xshell
• 前端：nodejs+vue

1 导图

环境基础+部署流程

2 xhsell 安装和配置

xshell 安装包+配色方案下载

xshell 安装 使用遇到的问题 + 配色方案

3 前端项目配置

1 修改后端地址

2 修改端口和前端不显示源码

在项目根目录 新建vue.config.js文件

module.exports = {
  devServer: {
    // 你定义的host
    host: xxxx,
    // 自定义端口
    port: 8080
  },
  // 隐藏源代码
  productionSourceMap: false
}

4 前端项目打包

1 命令打包

找到前端项目根目录 进入命令行 输入命令npm run build

vscode下打包

2 图形界面打包

vue给我们提供了管理平台 拿win10来讲 进入dos命令行 输入vue ui 进入首页

图形界面打包

5 上传到服务器

传输到服务器