在webpack.dev.conf.js使用dev-server做代理，前端请求代理地址，npm run dev时报错？

Question

webpack.dev.conf.js文件——dev-server对象

devServer: {
    clientLogLevel: 'warning',
    historyApiFallback: true,
    hot: true,
    host: process.env.HOST || config.dev.host,
    port: process.env.PORT || config.dev.port,
    open: config.dev.autoOpenBrowser,
    overlay: config.dev.errorOverlay ? {
      warnings: false,
      errors: true,
    } : false,
    publicPath: config.dev.assetsPublicPath,
    proxy: config.dev.proxyTable,
    quiet: true, // necessary for FriendlyErrorsPlugin
    watchOptions: {
      poll: config.dev.poll,
    },
    before(app) {
      app.get('/api/joke', function(req, res) {
        // 请求的api地址
        const url = 'http://api.jisuapi.com/xiaohua/text'

        axios.get(url, {
          params: req.query
        }).then((response) => {
            res.json(response)
        }).catch((error) => {
            console.error(error)
        })
      })
    }
  }

joke.vue文件

created() {
    this.axios.get('/api/joke', {
        params: {
            appkey: 'appkey',
            pagenum: 1,
            pagesize: 20,
            sort: 'addtime'
        }
    }).then((res) => {
        console.log(res)
    }).catch((err) => {
        console.error(err)
    })
}

运行npm run dev时，报以下错误

其中params没有问题，因为使用proxyTable代理是可以返回数据的。
请问这个问题该怎么解决？

Answer 1

遇到错误一步步分析啊，
报错信息是在序列化JSON的时候遇到循环引用了，那哪里用到json序列化了呢
整个文件就一个 res.json
那response为啥是循环引用的呢
因为axios在nodejs环境下调用的，使用的是nodejs的http模块，而不是ajax请求，而http模块默认返回的response是一个很复杂的对象，会循环引用到自己，类似于浏览器里的window.window这样

只要改成 res.json(response.data)就可以了

Answer 2

我想问下devServer之前引入的express和axios你是怎么配置的？现在我也遇到些问题