vue.config.js 中寫：

module.exports = {
  publicPath,
  assetsDir,
  outputDir,
  lintOnSave: false,
  devServer: {
    hot: true,
    port: devPort,
    open: true,
    noInfo: false,
    overlay: {
      warnings: true,
      errors: true,
    },
    before: (app, server, compiler) => {
      // 這里可以添加自定義的 IP 白名單中間件
      app.use((req, res, next) => {
        // 獲取客戶端 IP 地址
        let clientIp = req.ip || req.connection.remoteAddress
        console.log('d', clientIp)
        // 檢查是否有代理設(shè)置
        const forwarded = req.headers['x-forwarded-for']
        if (forwarded) {
          const forwardedIps = forwarded.split(',')
          clientIp = forwardedIps[0]
        }

        // 定義允許訪問(wèn)的白名單 IP 地址
        const whitelist = ['127.0.0.1']

        // 判斷客戶端 IP 是否在白名單中
        if (whitelist.includes(clientIp) || clientIp.startsWith('172.18') || clientIp.startsWith('122.228.187')) {
          next()  // 如果在白名單中，繼續(xù)請(qǐng)求
        } else {
          res.status(403).send('Forbidden' + clientIp)  // 如果不在白名單中，拒絕訪問(wèn)
        }
      })
    }
  },
  productionSourceMap: false,
  pluginOptions: {
    "style-resources-loader": {
      preProcessor: "less",
      patterns: "./src/assets/css/color.less"
    }
  },
}