首先明确一点,在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. 10个最容易犯的Python开发错误

    10个最容易犯的Python开发错误 转载 2017年09月25日 16:54:36 标签: python / 大数据 / 大讲台   Python是一门简单易学的编程语言,语法简洁而清晰,并且拥有丰 ...

  2. jmeter 命令行运行与生成报告

    一.     使用命令行方式运行Jmeter 1.1 为什么 使用GUI方式启动jmeter,运行线程较多的测试时,会造成内存和CPU的大量消耗,导致客户机卡死. 所以正确的打开方式是在GUI模式下调 ...

  3. Linux下安装mysql教程

    Linux下安装mysql  MySQL官网:https://dev.mysql.com/downloads/mysql/ 到mysql官网下载mysql编译好的二进制安装包,在下载页面Select ...

  4. 使用 wx.navigateBack返回页面并携带参数的处理方式

    getAddressList (){ let that = this; util.request(api.AddressList).then(function (res) { if (res.errn ...

  5. GitLab 安装,配置及维护

    参考: GitLab 官方文档 docker-gitlab,通过 docker-compose 快速安装 GitLab rake,是 Rails 的工具,类似 ruby 中常用的的 make.通过 R ...

  6. JSP+JavaBean 登陆验证

    1.java package cn.gs.ly; import java.util.HashMap; import java.util.Map; public class Register { pri ...

  7. 【FICO系列】SAP FICO模块-固定资产月结的注意点

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[FICO系列]SAP FICO模块-固定资产月 ...

  8. hihoCoder 1014 : Trie树(字典树)

    传送门 Description 小Hi和小Ho是一对好朋友,出生在信息化社会的他们对编程产生了莫大的兴趣,他们约定好互相帮助,在编程的学习道路上一同前进. 这一天,他们遇到了一本词典,于是小Hi就向小 ...

  9. Netty之揭开BootStrap 的神秘面纱

    客户端BootStrap: Bootstrap 是Netty 提供的一个便利的工厂类, 我们可以通过它来完成Netty 的客户端或服务器端的Netty 初始化.下面我先来看一个例子, 从客户端和服务器 ...

  10. 虚拟机环境搭建/修改VMware虚拟机固定IP

    VMware Workstation安装CentOS7.0 详情教程: centos7.0下载地址:http://isoredirect.centos.org/centos/7/isos/x86_64 ...