我是靠谱客的博主 结实爆米花,最近开发中收集的这篇文章主要介绍create react app项目中fetch请求本地json数据报错,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

fetch请求本地json数据报错

export const getInitToDoLists = (localUrl) => {
    fetch(localUrl)
        .then(res => res.json())
        .then(data => {
            console.log('local data', data)
        })
}

错误提示信息如下:
在这里插入图片描述

解决方案:
将对饮的json数据置于public目录下,使用fetch时再传入相对于public的文件url即可;或者使用process.env.PUBLIC_URL+’/finename.json’(来源于create react app文档using the public folder)

原因推测:
If you need to use a file from src or node_modules, you’ll have to copy it there to explicitly specify your intention to make this file a part of the build. ————来自于create react app文档
如果只是在开发目录比如src下创建一个json文件,引用解析此文件时,只是根据此文件的路劲,在通过webpack打包处理时,此json文件并没有做任何的处理,换句话说,webpack构建的前端包中并没有对这个json文件的引用,所以json会解析失败
同时可以查看文档中关于Public Folder的应用场景:
在这里插入图片描述

最后

以上就是结实爆米花为你收集整理的create react app项目中fetch请求本地json数据报错的全部内容,希望文章能够帮你解决create react app项目中fetch请求本地json数据报错所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(41)

评论列表共有 0 条评论

立即
投稿
返回
顶部