mock接口webpack配置proxy,CORS跨域,webpack-plugin

proxy 代理 笔记

本地mock接口webpack配置

proxy: {
  "/api": {
    target: "http://localhost:3000",
    changeOrigin： true,
    pathRewrite: {"^/api" : "/mockApi"}
  }
}

CORS跨域 （node）

var express = require('express');
var app = express();
var allowCrossDomain = function (req, res, next) {
	//res.header('Access-Control-Allow-Origin', '*');
  	res.header('Access-Control-Allow-Origin', 'http://localhost:8080');
 	res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
  	res.header('Access-Control-Allow-Headers', 'Content-Type');
  	next();
}
app.use(allowCrossDomain);

webpack-plugin 实现跨域

把前端服务和后端服务绑到一起
安装中间件

cnpm i webpack-dev-middleware -S

在node server中

//app.use(require('webpack-dev-middleware')(require('webpack')(require('./webpack.config.js'))))

let webpack = require('webpack')
let middle = require('webpack-dev-middleware')
let compiler = webpack(require('./webpack.config.js'))
app.use(middle(compiler ))