当前位置: 首页 > article >正文

08 —— Webpack打包图片

【资源模块 | webpack 中文文档 | webpack中文文档 | webpack中文网】https://www.webpackjs.com/guides/asset-modules/?sid_for_share=99125_3


Webpack打包图片以8KB为临界值判断

  • 大于8KB的文件:发送一个单独的文件并导出URL地址

  • 小于8KB的文件:导出一个dataURI(base64字符串)

打包到js文件里


filename:输出到assets下的文件名

test:/\.(png|jpg|gif)$/i,匹配以这些类型结尾的文件


小图

js中引入本地图片资源要用import方式(如果是网络图片,直接写字符串即可)

给src属性赋予图片的地址

加在.login-wrap容器的末尾

appendChild() 方法:可向节点的子节点列表的末尾添加新的子节点


大图

小图 


http://www.kler.cn/a/407331.html

相关文章:

  • 【UE5】在材质中计算模型在屏幕上的比例
  • 行列式的理解与计算:线性代数中的核心概念
  • IText创建加盖公章的pdf文件并生成压缩文件
  • 医工交叉入门书籍分享:Transformer模型在机器学习领域的应用|个人观点·24-11-22
  • Android12 的 Vold梳理
  • Matlab科研绘图:自定义内置多款配色函数
  • 谷粒商城-消息队列Rabbitmq
  • 从熟练Python到入门学习C++(record 6)
  • AMD64(Advanced Micro Devices) 超微半导体 (x86-64)
  • leecode45.跳跃游戏||
  • rembg AI扣图
  • php:使用Ratchet类实现分布式websocket服务
  • 第三百二十八节 Java网络教程 - Java网络TCP客户端套接字
  • PLC的指令全集1+TIA PORTAL仿真(西门子S7 1200)
  • 浮点数的表示—IEEE754标准
  • c#:winform引入bartender
  • 【大数据技术基础】 课程 第5章 HBase的安装和基础编程 大数据基础编程、实验和案例教程(第2版)
  • Windows之使用putty软件以ssh的方式连接Linux中文显示乱码
  • Django+Nginx+uwsgi网站使用Channels+redis+daphne实现简单的多人在线聊天及消息存储功能
  • 大疆上云api开发
  • /etc/sudoers 文件格式解读
  • VM虚拟机装MAC后无法联网,如何解决?
  • 飞凌嵌入式旗下教育品牌ElfBoard与西安科技大学共建「科教融合基地」
  • android 性能分析工具(03)Android Studio Profiler及常见性能图表解读
  • 绝世唐门:雨浩黑发泪痣形象,王东无新建模,动画漫画对比凸显
  • 百度在下一盘大棋