去哪儿网项目中Vue中无法访问到static目录下的json文件

最新推荐文章于 2023-04-21 11:30:45 发布
最新推荐文章于 2023-04-21 11:30:45 发布
阅读量2k 收藏
点赞数 1
分类专栏： WEB前端 文章标签： vue前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/daimadaxian/article/details/100064400
版权

在做去哪儿网项目做到要用ajax访问数据的时候，直接踩到坑,搞了一天尝试了各种方法

1.目录结构如下
目录结构
直接在浏览器地址栏输入如下内容就跳转回首页了，没办法直接访问到json的数据
在这里插入图片描述
Home下面按照教程写的
在这里插入图片描述
api是这样的
在这里插入图片描述
用api的时候是404

各种方法都尝试了还是访问不了，直接把json文件放在home.vue同级的目录去访问依然报404
在这里插入图片描述

最后修改了config 里的index.js,修改了端口号，问题得到了解决
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

程序员 沐阳
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
Vue-cli项目获取本地json文件数据的实例
11-29
通过查阅，我发现，在vue-cli基础上构建的项目中，只有static目录才是vue-cli向外暴露的静态数据文件夹，我放在static下的图片可以正常访问到，我是在static同级目录新建了datas目录，将json文件放入datas目录，请求...
前端VUE实战——去哪儿网项目实战.7z
08-17
用VUE框架实现的去哪儿网项目，建议学习完都实践一下，教程B站可以搜到“”VUE去哪儿网实战“”压缩包里有全部代码，配好环境可以直接运行看看效果！
vue-cli项目 build后请求本地static文件中的 json数据，路径不对，报错404处理方法...
weixin_33827731的博客
04-07 3911
vue-cli 项目 build 出错点： 　　1，build生成dist 放在tomcat上 报错，不显示内容 　　　　解决办法： config>index.js===>assetsPublicPath: '/', 修改为assetsPublicPath: './', 　　 　　note:如果css中图片不显示，打开“build/utils.js”，增加一行代码即可...
vue项目打包之后放在服务器上测试的时候访问不到本地json数据的解决方法
inticaler的博客
05-08 3085
上面的代码表示在本地开发项目时模拟后端数据。项目打包之后放在服务器上，json的路径需要按照原来的json实际路径放置才会访问到（/api/index.json）
vue打包 assetsPublicPath改变，static下文件访问不到的问题
热门推荐
Helen
03-29 3万+
问题背景： 一、.smallTarget项目，使用vue官网脚手架，修改了/config/index.js文件，把默认打包后的文件夹名称改成了“smallTarget”，这时候npm run build 打包部署，就可以访问到以smallTarget为根目录的页面。（相当于只修改了文件夹的名称而已） index: path.resolve(__dirname, '../smallTarget/i...
在vue中读取本地Json文件的方法
10-18
今天小编就为大家分享一篇在vue中读取本地Json文件的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Vue 实例实战之 Vue webpack 仿去哪儿网App页面开发（应用中的几个页面简单实现）源码
06-28
博文源码：Vue 实例实战之 Vue webpack 仿去哪儿网App页面开发（应用中的几个页面简单实现） Vue 开发的实例实战，模仿开发去哪儿网的几个页面 ，体验 Vue 在实战中应用，欢迎指出，或者你有更好的方法，欢迎留言。 ...
Vue2.5开发去哪儿网App 从零基础入门到实战项目
04-06
Vue2.5开发去哪儿网App 从零基础入门到实战项目
vue中无法访问静态资源
qq_45555170的博客
12-18 3557
vue中无法访问静态资源原因：解决看看效果 原因： 主要是项目的图片没有放到正确的路径之下，就基本上会出现vue访问不到静态静态资源的问题 解决 将所需要的图片放到static中就可以了，在读取对象的属性的时候只需要把照片的路径写准确即可，可以直接写路径访问到 在 static/img/ 后面直接加图片名称.这样项目中就能访问到了 大致就是一个这样的路径 看看效果 这样就能访问vue项目中的静态资源了 ...
vue打包之后，放到服务器上访问不到static文件夹下面的html文件，该如何解决
weixin_39418338的博客
07-02 5698
​以前都是和团队合伙开发前端，从不接触设置打包配置项。现在公司前端一个人，要自己学会配置。最近写公司官网，vue文件打包之后，在项目里面通过window.open()访问放在static下的html文件，放在公司服务器访问不到static下面的文件，问题出现在打包配置项上。 vue组件里面使用：window.open("/static/pro/protocol_privacy.html"); // 错误的写法 因为我打包配置不是在根目录下（/），而是放在/home/目录下，所以访问静态页面时...
解决访问static目录下文件找不到的问题（ 报404 ？）
sslcsq的博客
12-25 6895
在我们创建一个vue项目时，访问static静态资源目录下的文件时 报404 文件找不到 如何解决？ 此时我们打开终端 全局卸载cli 全局卸载：npm uninstall vue-cli -g 然后在中心下载 cli 全局安装：npm install vue-cli -g 然后在 /static/img/×××.jpg 就可以直接访问到了 vue默认情况下static目录的文件是直接可以...
vue部署项目之后，无法访问到静态资源（图片）
简的博客
06-29 1万+
首先参见如下帖子：https://blog.csdn.net/qq_39480597/article/details/79568173， 这个算是系统的管理了静态资源资源问题，适合大部分静态资源访问不到的情况，但是觉得很繁琐，我这边没有用，我下面列出一种，只有一两张图片访问不到的情况 我这边是访问图片出现了问题，而且只有一张，是通过new 出来的image对象，原始代码如下 // js操作dom，...
vue项目的业务页面中访问static静态资源，点击下载时报未发现文件
Kratial的博客
04-21 2047
【代码】vue项目的业务页面中访问static静态资源，点击下载时报未发现文件。
vue 读取本地代码：static目录下的json文件，并加载显示页面上
IT博客技术分享
10-18 4946
先上效果图： 从效果图可以看出是点击：button 打开json文件按钮的方法： html：<Buttontype="primary"@click="open_changeFile">打开json文件</Button> 调用的方法是： open_changeFile（）{ } 正确写法： 前提vue里面引入了axios了： 引入方法： impor...
关于vue项目中static文件下的静态文件找不到的问题
li00828的博客
03-29 2万+
在vue项目中，有一些数据我们并不希望被webpack打包，我们可以把这些数据写在一个js文件中，然后放在static（该文件下的内容不会被webpack打包）文件下。然后就是在别的地方调用这个js：我们在vue项目的根目录下的index.html文件中用script把该js文件引用进来。在其他的地方就可以使用这个js文件中的方法了。目的：在我们已经打包的文件中，可能会有一些名字/地址等数据，在不...
vue通过axios调用在static文件内的json文件的数据
weixin_45815557的博客
03-03 1084
vue通过vuex、axios调用在static文件内的json文件的数据 在项目内的静态文件static内创建一个json文件 json文件内的内容如下 在vue文件内引入axios 完整代码如下 <template> <div> <div class="nav"> <!-- vue通过使用axios调用json文件内的数据 --> <ul> <li v-for="(item,ind
vue.config.js 全局配置
轻风细雨_林木木
03-20 2万+
1.Webpack配置实例 参考：https://cli.vuejs.org/zh/config/ vue.config.js vue.config.js 是一个可选的配置文件，如果项目中存在这个文件，那么它会被 @vue/cli-service 自动加载，你也可以使用 package.json 中的 vue 字段配置，但是package.json中需要严格遵照 JSON 的格式来写。 文件初始值： /** * @type {import('@vue/cli-service').ProjectOpti
vue项目中package.json文件配置
最新发布
04-27
在 Vue 项目中，package.json 文件主要用于配置应用程序的依赖项、脚本命令和版本号等信息。以下是一个常见的 package.json 文件的配置示例： ```json { "name": "my-vue-app", "version": "1.0.0", ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值