vue.config

// 引入jq需要加入以下代码
const webpack = require('webpack')

module.exports={
    devServer:{
        //配置代理有两个好处.
        // 1.节约带代码量,方便后期维护
        // 2.可以解决跨域问题
        //了解一下什么是跨域?
        // 在了解跨域之前先了解一下 浏览器的同源安全策略;
        // 服务分为协议,主机,端口号.
        //我们现在启动的项目是通过内存启动的. 自动生成localhost服务. 服务 主机 端口号与后端服务不一致. 所以会触发同源策略 就是所谓的跨域问题.
        //那么问题来了? 为什么会有同源策略
        // 1.为了防止恶意网页可以获取其他网站的本地数据。
        // 2.为了防止恶意网站iframe其他网站的时候，获取数据。
        //  3.为了防止恶意网站在自已网站有访问其他网站的权利，以免通过cookie免登，拿到数据。

        // 那么引入今天的正题,为什么之前没有配置代理,也能请求到接口呢?
        //    解决跨域问题有很多种方式,在以后工作中,大部分跨域问题都有后端开发来解决,他们做一个注解就能解决跨域问题.
        //    那么后端帮助咱们解决了跨域问题,那咱们还用代理吗? 当然是要用的.

        port:3000,
        hot:true,
        proxy:{
            //当以api开头的请求会进行代理。
            '/api':{
                target:"http://www.shangyuninfo.com/", //你需要的代理的地址.
                changeOrigin:true, //是否允许跨域? true为允许.
                // pathRewrite:{
                //     '^/api':""//路径重写 请求时将api
                // }
            }
        }
    },
    chainWebpack: config => {
        config.plugin('provide').use(webpack.ProvidePlugin, [{
            $: 'jquery',
            jquery: 'jquery',
            jQuery: 'jquery',
            'window.jQuery': 'jquery'
        }])
    },
}