刚刚学习Vue，使用Vue-cli生成的项目，怎么配置服务器数据的访问？

Question

如题，用vue-cli init webpack [项目名], 我们都知道浏览器有跨域访问限制，使用npm run dev运行起来的服务是没有服务器代码支持的！这个问题怎么破？是要解决webpack的配置么？大家是怎么使用vue来开发的？

Answer 1

webpack-dev-server可以配置代理，

    devServer: {
        proxy: {
            '/some/path*': {
                target: 'https://other-server.example.com',
                secure: false,
            },
        },
    },

上述例子的效果就是，匹配到/some/path* 的http请求都会走https://other-server.example.com, *号是通配符。比如你的接口是'/some/path/login',那么webpackd-dev-server自动请求到'https://other-server.example.com/login'。
建议阅读官方文档

Answer 2

服务器端需要提供可访问的接口，或者用数据模拟下。 我就是用数据模拟了下，你可以看下 https://github.com/xwartz/vue-v2ex

Answer 3

@g0ne150 的办法应该算是一种解决方案。目前，我是自己修改了webpack的配置文件，使用watch方式将所有文件都编译到指定文件。

Answer 4

我也遇到这个问题使用vue-cli 生成的项目 配置代理无效
按这个配置无效
http://vuejs-templates.github.io/webpack/proxy.html

Answer 5

对于vue-cli配置代理无效的问题，我也遇到了，不过，按照vue-templates模板指定设置

配置完成后，需要将本地localhost的域名改下，也就是修改HOSTS文件，将127.0.0.1给一个自定义的域名（必须与访问服务器的域名后半部分相同如服务端域名为www.baidu.com,你定义的本地域名为xxx.baidu.com），这样就可以在本地通过代理拿到服务端的数据了