位置: IT常识 - 正文

关于Vite打包项目后图片丢失的解决方法(vnisedit 打包)

编辑:rootadmin
关于Vite打包项目后图片丢失的解决方法 文章目录1.打包时出现的问题2.解决方法1.打包时出现的问题

推荐整理分享关于Vite打包项目后图片丢失的解决方法(vnisedit 打包),希望有所帮助,仅作参考,欢迎阅读内容。

关于Vite打包项目后图片丢失的解决方法(vnisedit 打包)

文章相关热门搜索词:vite怎么打包文件太大,vite怎么打包文件太大,vsto打包,vite 打包,vsto打包,vite怎么打包文件太大,vite打包配置,vite打包配置,内容如对您有帮助,希望把文章链接给更多的朋友!

        在使用Vite脚手架开发项目时,打包后的项目会出现图片、图标等静态资源丢失问题。比如下面:         我的图片资源全在src/assets/img目录中,但是经过打包后img文件夹并没有出现在打包后的项目(dist文件夹)当中,这样会导致项目部署后找不到资源等一系列的问题。

2.解决方法

方法1:         Vite官网地址:https://cn.vitejs.dev/guide/assets.html#importing-asset-as-url         在需要的使用图标的地方去引入,比如:

import imgUrl from './img.png'document.getElementById('hero-img').src = imgUrl

        imgUrl在开发时会是/img.png,在生产构建后会是 /assets/img.2d8efhg.png。这种方法有一个缺点,当图片资源特别多时会很麻烦,需要先创建一个脚本,将所有需要的资源引入进来,然后以数组的形式导出,最后再通过遍历的形式去使用。(该方法没试过,但似乎应该差不了多少,哈哈哈哈)。 方法2:         方法2是官网中说的第二种方法,将所有静态资源放到public目录当中,然后打包时会将这些资源一同打包进去,如下面图片所示:         我的图片都在public/img目录当中,打包后会将img文件夹一同打包进项目,如dist文件夹中所示。         官网我只是看了一个大概,总结出这两种方法,如果大佬们不喜欢用可以自己研究一下,然后大家一起分享吧,哈哈哈哈!

本文链接地址:https://www.jiuchutong.com/zhishi/284117.html 转载请保留说明!

上一篇:vue中父组件异步数据通过props方式传递给子组件,子组件接收不到的问题(vue父组件引入子组件)

下一篇:猫鼬一家簇拥在一起 (© stefbennett/Shutterstock)(猫鼬家族风云)

  • 苹果13怎么设置上滑控制中心(苹果13怎么设置电池电量数字)

    苹果13怎么设置上滑控制中心(苹果13怎么设置电池电量数字)

  • 平板悬浮球怎么打开(平板悬浮球怎么弄)

    平板悬浮球怎么打开(平板悬浮球怎么弄)

  • 微信的卡包在哪里找(微信的卡包在哪里添加)

    微信的卡包在哪里找(微信的卡包在哪里添加)

  • 为什么微信名改了还是显示原来的(为什么微信名改了还是原来的)

    为什么微信名改了还是显示原来的(为什么微信名改了还是原来的)

  • wps分隔符号在哪里(wps中的分隔符在哪)

    wps分隔符号在哪里(wps中的分隔符在哪)

  • 相机开不了机为什么?(相机 开不了机)

    相机开不了机为什么?(相机 开不了机)

  • 华为的闹钟怎么找(华为的闹钟怎么设置自己喜欢的音乐)

    华为的闹钟怎么找(华为的闹钟怎么设置自己喜欢的音乐)

  • 针式打印机一进纸就退(针式打印机一进纸就卡纸了怎么办)

    针式打印机一进纸就退(针式打印机一进纸就卡纸了怎么办)

  • 什么软件录屏可以录内部声音(什么软件录屏可以把声音录进去)

    什么软件录屏可以录内部声音(什么软件录屏可以把声音录进去)

  • 淘宝拍单什么意思(淘宝拍单违法吗)

    淘宝拍单什么意思(淘宝拍单违法吗)

  • 苹果11怎么拍全屏照片(苹果11怎么拍全面屏照片)

    苹果11怎么拍全屏照片(苹果11怎么拍全面屏照片)

  • 华为lldtl10是什么型号(华为lld-tl10)

    华为lldtl10是什么型号(华为lld-tl10)

  • 手机数据线连接电脑不弹出usb怎么回事(手机数据线连接电脑上网)

    手机数据线连接电脑不弹出usb怎么回事(手机数据线连接电脑上网)

  • 微信非对方朋友啥意思(微信非对方朋友显示十条朋友圈)

    微信非对方朋友啥意思(微信非对方朋友显示十条朋友圈)

  • 小米电视如何看手机的视频软件(小米电视如何看有线电视)

    小米电视如何看手机的视频软件(小米电视如何看有线电视)

  • 手机外屏怎么拆下来(手机外屏怎么拆下来教程)

    手机外屏怎么拆下来(手机外屏怎么拆下来教程)

  • 苹果11怎么查序列号(苹果11怎么查序列号真伪)

    苹果11怎么查序列号(苹果11怎么查序列号真伪)

  • 拼多多怎么取消绑定微信(拼多多怎么取消先用后付)

    拼多多怎么取消绑定微信(拼多多怎么取消先用后付)

  • apple watch 网易云音乐本地是怎么下载的(applewatch网易云怎么调声音)

    apple watch 网易云音乐本地是怎么下载的(applewatch网易云怎么调声音)

  • 淘友加入黑名单会怎样(淘友加入黑名单了怎么还显示)

    淘友加入黑名单会怎样(淘友加入黑名单了怎么还显示)

  • iphone7要不要升级ios12

    iphone7要不要升级ios12

  • 港版iphonexr需要刷国行吗(xr港版好吗)

    港版iphonexr需要刷国行吗(xr港版好吗)

  • 批上送未完成怎么解决(批上送未完成怎么弄)

    批上送未完成怎么解决(批上送未完成怎么弄)

  • 华为p30如何清理后台(华为p30如何清理微信缓存)

    华为p30如何清理后台(华为p30如何清理微信缓存)

  • Protobuf生成文件报错(protobuf 文档)

    Protobuf生成文件报错(protobuf 文档)

  • 递延所得税如何影响所得税费用
  • 一般计税方法和简易计税方法的计算公式
  • 每股收益无差别点计算公式怎么解
  • 工程结算扣罚款怎么开票
  • 一个人可以两家以上公司发放工资么
  • 车辆停放服务属于交通运输服务吗
  • 低值易耗品包含什么
  • 行政单位暂付款怎么记账
  • 工程造价超出职称怎么办
  • 可抵扣增值税的发票
  • 购买无形资产的价款超过正常信用
  • 投资收益所得税税前扣除
  • 设备租赁涉及税种
  • 6位数开票代码
  • 发票冲红还需要作废吗
  • 发票认证后失控
  • 发票打印注意什么
  • 租金收入发票税目
  • 电子发票无法预览怎么弄
  • 一般纳税人转让固定资产增值税税率
  • 管理费用与税金的比例
  • 华为Mate50Pro配置多少
  • 在win7系统中,添加打印机驱动程序
  • windows8.1下Apache+Php+MySQL配置步骤
  • IE浏览器如何取消全屏
  • 设备进项抵扣新政策
  • 代理 linux
  • 待摊费用和预提费用改为什么科目了
  • 营业店面装修费怎么入账
  • PHP+MySql+jQuery实现的"顶"和"踩"投票功能
  • 补缴税款后还能退税吗
  • 工程施工科目下的间接费用怎么使用
  • 腾讯产品面经
  • object的类有哪些
  • 关于幼儿园国培的要求和建议
  • 进项税加计抵减是什么意思
  • 纸质承兑财务章怎么盖
  • 注册资本实缴后可以减资吗
  • 季度做账是什么意思
  • 季度申报所得税时可以用以前年度亏损吗
  • 资产处置损益是什么类
  • 应交税金科目应不应该有余额
  • 进口关税和增值税怎么做账
  • 取得增值税
  • php 时间
  • 年终奖发放有法律规定吗
  • ant design vue2.0
  • python字符串类型及操作
  • 专项扣除影响实绩吗
  • 什么情况下要缴纳房产税
  • 注册资本印花税2023年新规定
  • 公司之前借款没入账现在还款
  • 购买税控盘费用能全额抵扣吗
  • 税前利息为什么这么高
  • 盘盈的固定资产怎么处理
  • 怎么提高sql语句
  • haozipsvc.exe是什么
  • win10 怎么设置
  • services.exe修改注册表
  • win10怎么自定义壁纸
  • 双硬盘需要设置主从盘吗
  • 如何在ubuntu上安装软件
  • npscheck.exe - npscheck是什么进程 有什么用
  • 注册表没有windows nt
  • win7如何设置网络连接路由器
  • win10系统怎么关闭病毒防护
  • nodejs 视频切片
  • js观察者模式和发布订阅
  • samsung s3 gt-19300 开发 键盘回车事件
  • cocos游戏开发教程
  • shell中setenv
  • linux命令行怎么用
  • shell脚本编程实例
  • javascript scrollLeft,scrollWidth,clientWidth,offsetWidth 完全详解
  • 安卓手机管家如何卸载
  • unity3d初学者教程视频
  • 烟叶处理
  • 湖北税务官方网
  • 浙江通用电子发票查不到
  • 国家税务局吉林省税务局官网app
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设