Vue 3.x 项目打包放在服务器上出现的问题

vue3.x 搭建的项目，在请求接口的时候，我们会用到代理。

在项目的根目录下新建文件 vue.config.js 文件，在该文件里面配置如下：

module.exports = {
    publicPath: './', // 根路径
    outputDir: 'dist', // 构建输出目录
    assetsDir: 'assets', // 静态资源目录(js,css,img,fonts)
    lintOnSave: false, // 是否开启eslint保存检测,有效值（true||false||error)
    devServer: {
      port: 8000,
      proxy: {
        // 配置跨域
        '/wypapi': {
          target: 'http://39.108.184.152:9001',
          ws: true, // 是否跨域
          changeOrigin: true,
          // 重写地址
          pathRewrite: {
            '^/wypapi': ''
          }
        }
      }
    }
  }
  

以上是前端的配置。
我们将打包后的dist文件放在服务器上的话，还需要在nginx上进行如下配置：

location /wypapi/{
    proxy_pass http://39.108.184.152:9001/;
}

这样打包后的文件放在服务器上就不会出现问题啦。