vuecli3项目生产环境跨域处理

Vue CLI 3 生成的项目在开发环境中可以很容易地处理跨域请求，但在生产环境中跨域请求需要一些额外的配置。

在生产环境中，我们可以通过在 Vue CLI 3 项目的根目录下创建一个名为 vue.config.js 的文件来进行设置。在该文件中，我们可以使用 configureWebpack 选项来修改 Webpack 的配置。

要处理生产环境中的跨域请求，我们可以通过添加一个代理来实现。首先，我们需要安装一个用于配置代理的第三方库，例如 http-proxy-middleware。可以通过运行以下命令进行安装：

npm install http-proxy-middleware --save-dev

然后，在 vue.config.js 文件中，我们可以使用如下代码来配置代理：

const proxyMiddleware = require('http-proxy-middleware');

module.exports = {
  configureWebpack: config => {
    if (process.env.NODE_ENV === 'production') {
      config.devServer = {
        proxy: {
          '/api': {
            target: 'http://example.com', // 后端 API 的服务地址
            changeOrigin: true,
            pathRewrite: {
              '^/api': '', // 如果接口地址中有 /api 前缀，则可以通过 pathRewrite 将其去除
            },
          },
        },
      };
    }
  },
};

在上面的代码中，我们通过将请求路径中的 '/api' 前缀替换为空字符串，实现了将 '/api' 前缀去除。这只是一个示例，你需要根据自己的实际情况进行配置。

这样，当我们在生产环境中向 '/api' 路径发送请求时，请求将被代理到指定的服务地址，从而实现跨域请求处理。

需要注意的是，上述配置中的 target 属性需要替换为你自己后端 API 的实际服务地址。

完成这些设置后，我们需要重新构建生产环境的代码，以使配置生效。可以运行以下命令来构建代码：

npm run build

完成构建后，生成的生产环境代码中将包含跨域请求的代理设置。

希望以上回答对你有所帮助！