首先明确一点，在vue cli3以上的版本中，存放静态资源的文件是public

我刚开始以为是和vue cli2一样需要放在static文件夹下，但是项目中没有这个文件夹，我就自己创建了一个，结果请求的时候总是报错404

这个路径看似没毛病啊，于是我就搜资料

发现在vue cli3中静态资源是需要放在public中的，我改动后再次请求，还是报错

这种问题让人很纳闷，后来我尝试把public删了，直接  这样/json/data-china.json来访问

结果请求成功了

是什么原因呢？？？

原来是在vue cli3以上的版本中，你只要把那个你想请求的文件跟在localhost:8080后面，vue会自动去public文件夹下面找这个文件

看似简单的一个请求数据，花费了我一早上的时间，总算填坑了，下面这篇链接文章可以帮助我们更好的优化这个功能

https://blog.csdn.net/huangguangyourena/article/details/93186544

vue cli3以上的项目中如何使用axois请求本地json文件的更多相关文章

  1. vue cli3 创建的项目中eslint 配置 问题的解决

    1--   vue cli3 项目文件结构 2-- 注释问题 在eslintrc.js 文件中,将 '@vue/standard' 注释后重启即可: 3-- 配置 eslint 文件 在 vue-cl ...

  2. 如何在vue中请求本地json文件

    1..修改webpack.base.conf.js 文件中添加'/static': resolve('static'),如下所示,此时存放于static的json文件就可以通过/static/xxx. ...

  3. vue使用axios请求本地json文件出现404

    之前的路径是这么写的,一直出现404,后来发现必须是http的才可以,这样是无法请求的 把路径改为以下   位置根据json文件决定,但是必须是http://localhost:断口号

  4. 在进行vue的学习，项目中需要引入bootstrap、jquery的步骤。

    在进行vue的学习,项目中需要引入bootstrap.jquery的步骤. 一.引入jQuery 在当前项目的目录下(就是package.json),运行命令 cnpm install jquery ...

  5. vue-cli项目 build后请求本地static文件中的 json数据，路径不对，报错404处理方法

    vue-cli 项目 build  出错点: 1,build生成dist 放在tomcat上 报错,不显示内容  解决办法: config>index.js===>assetsPublic ...

  6. vue 模拟后台数据（加载本地json文件）调试

    首先创建一个本地json文件,放在项目中如下 { "runRedLight":{ "CurrentPage": 1, "TotalPages" ...

  7. 手把手教你vue配置请求本地json数据

    本篇文章主要介绍了vue配置请求本地json数据的方法,分享给大家,具体如下:在build文件夹下找到webpack.dev.conf.js文件,在const portfinder = require ...

  8. vue配置 请求本地json数据

    第一步:在build文件夹下找到webpack.dev.conf.js文件,在const portfinder = require('portfinder')后添加 //第一步const expres ...

  9. SpringMVC中使用Ajax POST请求以json格式传递参数服务端通过request.getParameter("name")无法获取参数值问题分析

    SpringMVC中使用Ajax POST请求以json格式传递参数服务端通过request.getParameter("name")无法获取参数值问题分析 一:问题demo展示 ...

随机推荐

  1. php面试专题---Mysql索引原理及SQL优化

    php面试专题---Mysql索引原理及SQL优化 一.总结 一句话总结: 注意:只写精品 1.为表设置索引要付出代价 是什么? 存储空间:一是增加了数据库的存储空间 修改插入变动索引时间:二是在插入 ...

  2. groub by 与 over partition by 的区别

    这个逻辑,写的很对.明白了这个意思. over partition by 前面一定要用汇总函数.groub by 就可以不用.本质都是汇总 SELECT a.* ,SUM(a.audit_status ...

  3. 排序算法二：归并排序(Merge sort)

    归并排序(Merge sort)用到了分治思想,即分-治-合三步,算法平均时间复杂度是O(nlgn). (一)算法实现 private void merge_sort(int[] array, int ...

  4. 《STL源码剖析》——第五、六：关联容器与算法

    第五章.关联容器  5.0.关联容器 标准的STL关联式容器分为set(集合)和map(映射表)两大类,以及这两大类的衍生体multiset(多键集合)和multimap(多键映射表).这些容器的底层 ...

  5. JavaScript.import

    // --file.js-- function getJSON(url, callback) {   let xhr = new XMLHttpRequest();   xhr.onload = fu ...

  6. git常用命令总结 git常用命令总结

    git常用命令总结:https://www.cnblogs.com/jackchensir/p/8306448.html 利用git提交代码 一.首先需要下载git 查看电脑是否安装git,打开终端, ...

  7. 2019 Multi-University Training Contest 1 - 1004 - Vacation - 二分 - 思维

    http://acm.hdu.edu.cn/showproblem.php?pid=6581 一开始想了好几个假算法.但是启发了一下潘哥,假如时间知道的话就可以从头开始确定各个车的位置.那么直接 \( ...

  8. MVC模型的基本原理及实现原理

    [转载]MVC架构在Asp.net中的应用和实现 摘要:本文主要论述了MVC架构的原理.优缺点以及MVC所能为Web应用带来的好处.并以“成都市信息化资产管理系统”框架设计为例,详细介绍其在Asp.n ...

  9. 踩坑，vue项目中，main.js引入scss文件时报错

    当我们在src目录下创建.scss文件,并在main.js中引用,运行时会报: ERROR Failed to compile with 1 errors 5:25:07 PMThis relativ ...

  10. ERROR in Template execution failed: ReferenceError: htmlwebpackPlugin is not defined

    ejs文件配置如下: <!DOCTYPE html> <html lang="zh-CN"> <head> <title>webpa ...