【无标题】

1. webpack开启代理的配置
   打开项目中的 vue.config.js 文件，添加下列配置

devServer: {
		open: true,
		host: 'localhost',
		port: 8080, // 前端项目的运行端口
        proxy: {
            '/api1': { // 匹配所有以'/api1' 开头的请求路径
                target: 'http://localhost:5000', // 代理目标的基础路径
                changeOrigin: true,
                pathRewrite: {'^/api1':''} // 重写路径
            },
    }

2. vite 开启代理的配置
   打开项目中的 vite.config.js，添加下列配置

export default defineConfig({
  server: { // 千万不能写成webpack里的devServer，会导致配置无效！！！
    // open: true, // 不能加上，否则配置会无效
    proxy: {
      // host: '127.0.0.1', //vite里不需要这个，否则报错
      // port: 3000, //vite里不需要这个，否则报错
      '/api': {
        target: 'http://127.0.0.1:8081',//要代理的本地api地址
        changeOrigin: true,//允许跨域
        ws: true, // 开启websocket
        // pathRewrite:{"^/api":"/"}//将/api开头替换为/api
        rewrite:(path) => path.replace(/^\/api/, "")
      },
      // 配置多个代理
      // "/service": {
      //   "target": 'https://www.google.com/',
      //   "secure": false,
      //   "changeOrigin": true,
      // },
    },
  },
})

3. 不同之处
   1. devServer 一定要改成 server，否则会导致proxy代理配置无效！
   2. open: true 这个配置项在vite里不能使用，否则无效！