1、webpack.devServer配置
如果要启用webpack代理,则配置如下:
webpackConfig.devServer = { hot: true, hotOnly: false, // If true: Enable HMR without page refresh when build failure open: true, // auto open port: 8080, overlay: true, publicPath: '/', proxy: { '(/crmp/admin/**)': { target : 'http://10.6.183.146:8088/', changeOrigin: true, secure: false, // 接受运行在 HTTPS 上,且使用了无效证书的后端服务器 }, }, quiet: true, }
proxy中的代理请求地址必须是相对路径,且从相对路径左侧开始匹配,如 (/crmp/admin/xxx)代理的是 http://localhost:8080/crmp/admin/xxx请求路径,代理到后端http://10.6.183.146:8088/crmp/admin/xxx地址。
代理后,我们在浏览器网络栏看到的请求地址是:
Request URL:http://localhost:8080/crmp/admin/xxx。
实际是代理服务器请求了后端接口,再把数据响应给localhost:8080。
2、搭建基于webpack4+vue2.6的多页框架骨架