在控制台输入如下命令对vue项目进行打包，打包前注意调整好项目的参数、配置等，如果有误，只能重新打包重新部署了┭┮﹏┭┮，注意一下axios的请求根路径，host配置为你的云服务器地址，而不是localhost
npm run build
打包完毕后会得到如下的dist文件夹
然后使用Xftp连接上云服务器，将dist文件夹上传至服务器，然后在dist文件夹的同级目录下，新建一个Dockerfile文件
vim Dockerfile #在文件中输入如下信息 # 设置基础镜像 FROM nginx # 将dist文件中的内容复制到 COPY dist/ /usr/share/nginx/html/ # 暴露端口，就是你的vue前端的访问端口 EXPOSE 8888
然后使用如下命令新建一个docker镜像，注意后面有一个点，vue_blog就是镜像名字
docker build -t vue_blog .
建好后可以使用如下命令查看
docker images
然后使用如下命令运行容器，其中-p后面参数的意思是将云服务器的8888端口作为前端项目的端口
docker run -d --name vue_blog -p 8888:80 vue_blog
运行成功可以使用如下命令查看到
docker ps2.后端部署
idea直接使用maven就可以打包了，打包前记得引入maven的插件，如果你的redis和mysql是使用docker安装的，地址记得换为云服务器地址。
打包成功后可以在target目录下看到项目的jar包
然后也是一样的步骤，使用xftp将jar包传到云服务器上，在同级目录下新建一个Dockerfile，blog-api-1.0-SNAPSHOT.jar就是jar包的名字
vim Dockerfile FROM java:8 VOLUME /tmp ADD blog-api-1.0-SNAPSHOT.jar /app.jar RUN sh -c 'touch /app.jar' ENV JAVA_OPTS="" ENTRYPOINT [ "sh", "-c", "java $JAVA_OPTS -Djava.security.egd=file:/dev/./urandom -jar /app.jar" ]
然后也是一样的创建docker镜像
docker build -t java_blog .
然后使用如下命令运行后端项目
docker run -d --name java_blog -p 8899:8899 java_blog3.阿里云服务器相关配置
在云服务器的控制台中，点击实例，然后点击操作中的管理，选择安全组，点击配置规则，按如下添加配置规则，前端项目、redis和mysql建议设置来源为你的云服务器地址。做好这一步，你的项目才能完整访问到。
首先使用docker安装Nginx，具体步骤就省略了，安装完毕后运行在80端口，然后对Nginx进行配置。在Nginx的conf目录下的nginx.conf文件中的末尾、include的上方插入如下代码，blog是起的上游服务器名称，xx.xx.xx.xx是你的云服务器地址，8888是前面配置的前端项目的运行端口
upstream blog {
server xx.xx.xx.xx:8888;
}
然后来到conf.d文件夹下，复制一个default.conf，随便起一个名字，在该文件中进行如下配置。这里server_name暂时设置为localhost，等后续购买域名并备案后，换成域名就可以使用域名访问你的网站了。重要的是proxy_pass这一行。
listen 80;
listen [::]:80;
server_name localhost;
#access_log /var/log/nginx/host.access.log main;
location / {
proxy_pass http://blog;
root /usr/share/nginx/html;
index index.html index.htm;
}
三、最终效果
最后的效果就是在浏览器输入你的服务器IP地址，就能直接访问到你的项目。
