vite 引入public下css、js、json等文件报错问题的研究

在阅读官方文档时发现这样一个描述
在这里插入图片描述
于是出于好奇我尝试了一下,发现如下规律:
1.在vite搭建项目中import引入public下的图片、音频、视频都不会报错,并且在vue templete中直接通过给img标签的src赋值/aaa.png也是正常的。
2.在src下的任何文件中引入(包括js文件、jsx文件、.vue文件)中通过import引入public下的js、css、json文件都会报错。如下图:
在这里插入图片描述
引入json时,则会直接报错文件不存在。

原因:在知乎上找到了一个靠谱的回答:
在这里插入图片描述
我理解的就是,vite会将所有import导入的文件打包,但是public下的文件不应该被打包,而是直接被copy,因此二者就冲突了,vite就拒绝了使用import引入js、css、json等文件,但是注意,媒体类文件是可以通过import导入的,获取到的是一个地址。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值