vue.config.js devserver

// vue.config.js

module.exports = {
  devServer: {
    // 基本URL路径
    publicPath: '/',

    // 服务器主机地址
    host: 'localhost',

    // 端口号
    port: 8080,

    // 自动打开浏览器
    open: true,

    // 代理配置，解决开发环境的跨域问题
    proxy: {
      '/api': {
        target: 'http://localhost:3000', // 目标API服务器的基址
        changeOrigin: true, // 是否改变请求源信息
        pathRewrite: {
          '^/api': '' // 重写路径，去掉/api前缀
        }
      }
    },

    // 热更新
    hot: true,

    // 输出日志级别
    overlay: {
      warnings: true,
      errors: true
    }
  }
};

解释说明：

• publicPath：指定资源的基础路径，默认是 /。
• host：设置开发服务器的主机地址，默认是 localhost。
• port：设置开发服务器的端口号，默认是 8080。
• open：设置是否自动打开浏览器。
• proxy：用于配置代理，解决开发环境中的跨域问题。通过将 /api 开头的请求代理到目标服务器（如 http://localhost:3000），可以避免跨域问题。
• hot：启用热更新功能，修改代码后页面不会刷新，而是只更新修改的部分。
• overlay：在浏览器中显示编译错误或警告信息。