【vue】项目打包&部署到tomcat&express部署&无法请求后台接口404&Access-Control-Allow-Origin跨域问题

vue项目打包&express部署

2022/3/30 周三

vue新手入门，如有错误，欢迎在评论区指出，非常感谢！

---

一、vue项目打包

cnpm run build 命令打包

默认会打包到项目文件夹下的 dist 文件夹里

遇到问题：

1. 打包后点击页面一片空白

config下面的index.js中，bulid模块里修改导出路径，assetsPublicPath 的 '/'改为 ‘./’

2. 图片等静态资源没有访问到

build下面的utils.js中，找到 generateLoaders 方法的 return ExtractTextPlugin.extract

在里面加一行 publicPath:“…/…/”

    if (options.extract) {
   
      return ExtractTextPlugin.extract({
   
        use: loaders,
        fallback: 'vue-style-loader',
        publicPath:'../../'
      })
    } else {
   
      return ['vue-style-loader'].concat(loaders)
    }

二、部署到tomcat

在tomcat的webapps里建一个自己的项目文件夹，如我的是XEFC

把打包获取的static文件夹和index.html放到里面就好了：