SpringBoot整合Vue部署

SpringBoot整合Vue部署说明Vue项目打包SpringBoot项目说明由于开发采用的前后端分离开发，所以前端用了Vue。后端用了Springboot，然而在开发完成以后。需要将前后端放入到一起去部署，所以想到了将Vue打包后的项目部署到springboot项目中Vue项目打包npm run build#由于我用的是Vue-element-Admin模板，打包命令是npm run buil

拾光-铼

3148人浏览 · 2020-05-18 10:10:14

拾光-铼 · 2020-05-18 10:10:14 发布

SpringBoot整合Vue部署

说明
- Vue项目打包
- SpringBoot项目

说明

由于开发采用的前后端分离开发，所以前端用了Vue。后端用了Springboot，然而在开发完成以后。需要将前后端放入到一起去部署，所以想到了将Vue打包后的项目部署到springboot项目中

Vue项目打包

npm run build
#由于我用的是Vue-element-Admin模板，打包命令是
npm run build:prod

SpringBoot项目

在.yml配置文件中设置静态资源路径

 spring.resources.static-locations=classpath:/META-INF/resources/, classpath:/META-INF/resources/webjars/, classpath:/static/

然后目录结构如下
在这里插入图片描述
将项目重启就可以正常访问了：
localhost:8080/index.html

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^