vuecli3项目集成到springboot

路径配置

当springboot中设置项目访问路径

server.servlet.context-path=/demo

　

vue项目中vue.config.js需配置publicPath

module.exports = {
  transpileDependencies: true,
  configureWebpack: {
    resolve: {
      alias: {//配置目录的别名
        'assets': '@/assets',
        'common': '@/common',
        'components': '@/components',
        'network': '@/network',
        'views': '@/views',
      }
    }
  } ,
  publicPath: process.env.NODE_ENV === 'production' ? '/demo' : './'
}

 

 

 

springboot配置文件

# 应用名称
spring.application.name=vue202211
# 应用服务 WEB 访问端口
server.port=8088
#设置项目访问根路径
server.servlet.context-path=/demo
#自定义Springboot前端静态资源的位置
spring.resources.static-locations:classpath:/static/dist,classpath:/templates/

 

将打包后的vue项目，dist文件夹放至springboot的static目录下

 

 

启动项目，访问url：

http://localhost:8088/demo/

 

 

 

运行vue项目：

npm run serve

打包vue项目：

npm run build