非Vue脚手架项目，打包后跨域问题？

Question

问题：

用Vue框架搭建了一个单页面个人博客，数据都是本地模拟的 .json 文件，放在 static/mock/ 文件夹下，打包以后出现了跨域问题，请问各位大佬有没有合适的解决方案？前端小白虚心求教！

    //axios请求地址
    getArticleList(){
      axios.get('/api/article.json')
      .then(this.getArticleSucc)
    }
    

    //这里的处理似乎只在开发环境下有效？
    devServer: {
        proxy: {
          '/api': {
            target: 'http://localhost:8080',
            pathRewrite: {
              '^/api': '/static/mock/'
            },
            changeOrigin: true
          }
        }
      }

报错信息：

Answer 1

先不说devServer只是开发环境使用的配置了。开发时在本地调试，想读取到本地的JSON文件也是需要基于 Node 起一个本地服务的，比如你可以用http-server这类的插件直接开启一个本地服务。如果想打包后部署去别的服务器（依然使用 Node平台）需要在项目里集成express或koa，配置一个极简的服务启动文件。
另外 ajax 是配合 HTTP 协议使用的，file 协议是查找本地路径地址，打包后的项目一般是属于生产版本，除非你在本地起一个后端服务，把项目部署起来，这个接口才能跑起来，如果想尝试简单自动地部署一个测试项目可以试试Heroku这样的第三方。正式的项目就需要更多的架构方案了。

Answer 2

devServer这个只在开发环境有效兄弟,你可以直接把你工程项目部署上去,或者你把你的json放在现在模拟接口json的网站上,而且为啥用vue搭建,还搞json,现成的做博客方案那么多,博客,都是markdown生成的,你要自己做,自己也做个后台喂

Answer 3

我和你遇到同样的问题，怎么解决的，兄嘚