vue.config.js配置network

### 如何在 `vue.config.js` 中配置网络相关设置

在网络相关的配置方面，主要涉及到开发服务器的配置项。这些配置可以通过修改 `devServer` 来实现[^2]。

#### 开发服务器 (`devServer`) 的常用配置

- **host**: 设置主机地址，默认是 `localhost` 或者 `0.0.0.0` 如果是在局域网内访问的话可以指定 IP 地址。

    module.exports = {
      devServer: {
        host: '0.0.0.0'
      }
    };

- **port**: 设定端口号，默认情况下会尝试使用 8080 端口，如果被占用则自动寻找下一个可用端口。

    module.exports = {
      devServer: {
        port: 8081
      }
    };

- **https**: 是否启用 HTTPS 协议，默认为 false；当设为 true 时可提供更安全的数据传输方式。

    const path = require('path');

    module.exports = {
      devServer: {
        https: {
          key: fs.readFileSync(path.resolve(__dirname, 'certs/server.key')),
          cert: fs.readFileSync(path.resolve(__dirname, 'certs/server.crt'))
        }
      }
    };

- **proxy**: 反向代理设置，用于解决前后端分离项目中的跨域请求问题。

    module.exports = {
      devServer: {
        proxy: {
          '/api': {
            target: 'http://jsonplaceholder.typicode.com',
            changeOrigin: true,
            pathRewrite: {
              '^/api': ''
            },
            secure: false
          }
        }
      }
    };

通过上述几种常见的 `devServer` 属性，可以根据实际需求调整 Vue 应用程序运行期间的行为特性，从而更好地满足不同场景下的开发调试要求。