webpack跨域

webpack数据获取问题实践

新建server.js写一个简单的后台服务

let express = require('express')
let app = express()
app.get('/user', (req, res) => {
  res.json({
    name: 'yuqin'
  })
})
app.listen(3000, () => {
  console.log('链接')
})

1.跨域
在devServer中添加

proxy: {
      '/api': {
        target: 'http://localhost:3000',
        pathRewrite: { '^/api': '' },
        changeOrigin: true,
      }
    }

2.模拟数据
在devServer中添加

    before(app) {
        app.get('/api/user',(req,res)=>{
            res.json({
                name: 'yuqin'
            })
        })
    }

3.前端与服务端公用一个端口
开启服务器的时候，webpack的devServer也开启了

安装webpack-dev-middleware插件
在server.js中

let webpack = require('webpack')

// 配合3使用，中间件
let middleWare = require('webpack-dev-middleware')
let config = require('./webpack.config.js')

let complier = webpack(config)
app.use(middleWare(complier))

感觉一般比较常用的是第一种吧