sprigboot+vue项目部署到阿里云服务器

前端vue部署到阿里云

首先需要有一台属于自己的阿里云服务器,新用户可以免费体验一个月,不满24岁的学生购买就很优惠,一般用户购买也可以赶阿里的活动购买,活动链接:
https://www.aliyun.com/minisite/goods?userCode=0phtycgr
- 有了服务器后需要安装jdk(使用宝塔面板一键安装)
- 安装tomcat(使用宝塔面板一键安装)
- 安全组开放端口,3306,8080,项目需要的端口,这些端口都需要手动开启
下边开始vue云端部署

1. 修改vue文件
   -修改config目录下的index.js文件,将build{}内的assetsPublicPath的’/‘改为’./’,注意是改成’./’,没有这个点部署到云端首页访问会出现空白
   

   -修改build目录下的utils.js,在if(options.extract){}中fallback下方添加一行publicPath:’…/…/’,没有这一行图片加载不出来
   
   -有跨域处理的要将src目录下的main.js中的url地址localhost改为阿里云的ip
   

2. 在vscode使用ctrl+~快捷键调出终端,输入npm run build,打包完成后会出现一个dist文件夹

3. 将dist文件夹放在云端tomcat目录下的webapps文件夹中

4. 此时在浏览器中输入阿里云ip + : + 端口号 + / + dist,如10.10.10.10:8080/dist,此时出现vue页面完成前端部署

后端springboot部署

后端部署也需要修改源文件,并且在阿里云上已经将数据库进行了同步
下边开始后端部署
1.修改url
-有跨域处理的同样将localhost改为阿里云ip
-properties配置文件或者xml或者yml文件中将数据库url,同样将localhost改为阿里云ip
2.修改启动类
-启动类继承SpringBootServletInitializer类,重写configure方法
注意:括号内的.class前边写对启动类名,这里用HelloWorldApplication代替

@Override
    protected SpringApplicationBuilder configure(SpringApplicationBuilder builder) {
        return builder.sources(HelloWorldApplication.class);
    }

3.打jar包

首先双击clean清除一下以前打包记录,然后点击install自动打成jar包,默认在target文件夹下会出现 .jar 和 .jar.original 两个包,我们需要的是.jar这个包
4.复制jar包到阿里云
可以使用FTP或使用xshell/finalshell打开文件视图直接拖拽到阿里云目录中去
5.运行jar包
在阿里云jar包所在目录,命令行输入

			java -jar HelloWorld.jar
启动jar包
也可以使用命令
			 nohup java -jar HelloWorld.jar &
在后台运行jar包,注意:&不能省略

**

到此前后端项目都已部署在阿里云服务器,在浏览器中使用阿里云ip直接访问项目吧

**

有问题可以参考资料,希望能帮到大家
[1] vue打包的详细步骤记录

[2]SpringBoot项目打包部署以及异常Exception in thread “main” java.lang.ClassNotFoundException