解决Vue+Vite打包后Leaflet的marker图标不显示的问题

前言

用Leaflet写关于WebGIS的开发,用Vite或者webpack打包,打包后会找不到图标,如下所示。

直言的说,笔者去网上搜了搜,其实收到一个比较好是答案。网址如下。

(完美解决~)关于Vue+Leaflet添加market时,图片不显示的问题_vue2leafletjs地图添加marker不显示-CSDN博客

这位大佬的方法是可以的。以前笔者遇到这个问题是这样解决的。但笔者发现了第三种方法。

解决方法

将目录node_modules/leaflet/dist/images中的maker-icon-2x.png和marker-shadow.png文件复制到pubilc目录下。

再次打包,路径中出现那两张png图片,运行没有问题。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/35183.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

eslint 与 prettier 的一些常见的配置项(很详细)

目录 1、eslint 常见配置项(语法规范) 2、 prettier 常见的配置项(格式规范) 代码规范相关内容看小编的该文章,获取对你有更好的帮助 vsCode代码格式化(理解eslint、vetur、prettier,实现格式…

IDEA启动报错:Abnormal build process termination...

一、问题描述 因为项目需要,同时打开了两个idea,突然发现一个启动的时候报错,有点莫名其妙,刚还好好的,为啥就不能用了,一顿百度找方法,试了各种方法,像重新安装jdk、重启系统发现都…

TensorFlow开源项目

欢迎来到 Papicatch的博客 文章目录 🍉TensorFlow介绍 🍉主要特点和功能 🍈多语言支持 🍈灵活的架构 🍈分布式训练 🍈跨平台部署 🍈强大的工具链 🍈丰富的社区和生态系统 &a…

c++基本数据类型和计算(一)习题讲解

1.【单选题】以下说法正确的是? A. unsigned 类型的值 最大为0xFFFFFFFF B. float类型的值大约有15位精度 C.bool类型占用4个字节 解析: 选项A:unsigned 类型的值 最大为 4个字节,正确。选项B: 因为float类型的值是单精度的浮…

Vue3基础使用

目录 一、创建Vue3工程 (一)、cli (二)、vite 二、常用Composition API (一)、setup函数 (二)、ref函数 (三)、reactive函数 (四)、setup注意事项 (五)、计算属性 (六)、watch (七)、watchEffect函数 (八)、生命周期 1、以配置项的形式使用生命周期钩子 2、组合式…

kafka-简单代码实现生产者消费者

生产者代码: package com.kafka.test;import org.apache.kafka.clients.producer.KafkaProducer; import org.apache.kafka.clients.producer.ProducerConfig; import org.apache.kafka.clients.producer.ProducerRecord; import org.apache.kafka.common.seriali…

【机器学习-10】 | Scikit-Learn工具包进阶指南:Scikit-Learn工具包之支持向量机模块研究

🎩 欢迎来到技术探索的奇幻世界👨‍💻 📜 个人主页:一伦明悦-CSDN博客 ✍🏻 作者简介: C软件开发、Python机器学习爱好者 🗣️ 互动与支持:💬评论 &…

高考填报志愿攻略,5个步骤选专业和院校

在高考完毕出成绩的时候,很多人会陷入迷茫中,好像努力了这么多年,却不知道怎么规划好未来。怎么填报志愿合适?在填报志愿方面有几个内容需要弄清楚,按部就班就能找到方向,一起来了解一下正确的步骤吧。 第…

入局AI手机 苹果公布Apple Intelligence

日前,苹果WWDC 2024如期召开。在这持续1个小时44分钟的开发者大会上,苹果在前一个小时里更新了iOS、iPadOS、MacOS等操作系统,而且还首次更新了visionOS。余下的时间全部留给了苹果的“AI大礼包”——Apple Intelligence(苹果智能…

请说明Thread类中run和start的区别,从方法的区别,及运行结果的区别分别说明

方法本身的区别 start() 方法: run()方法是Thread类的一个普通方法,它包含了线程要执行的代码。当你直接调用一个线程的run()方法(如myThread.run()),你实际上是在当前线程(通常是主线程)中执行…

PointCloudLib-滤波模块(Filtering)-使用参数化模型投影点

在本教程中,我们将学习如何将点投影到参数化模型上 (例如,平面、球体等)。参数模型通过一组 系数 – 在平面的情况下,通过其方程:ax + by + cz + d = 0。 代码 #include <iostream> #include <pcl/point_cloud.h> // for PointCloud #include <pcl/point…

mysql是什么

mysql是什么 是DBMS软件系统&#xff0c;并不是一个数据库&#xff0c;管理数据库 DBMS相当于用户和数据库之间的桥梁&#xff0c;有超过300种不同的dbms系统 mysql是关系型数据库&#xff0c;关系型数据库存储模型很想excel&#xff0c;用行和列组织数据 sql是一门编程语言…

关于ip地址的网页无法访问navigator的gpu、媒体、蓝牙等设备的解决方法

在使用threejs的WebGPURenderer渲染器时&#xff0c;发现localhost以及127.0.0.1才能访问到navigator.gpu&#xff0c;直接使用ip会变成undefined,原因是为了用户的隐私安全&#xff0c;只能在安全的上下文中使用&#xff0c;非安全的上下文就会是undefined&#xff0c;安全上下…

谷歌云(GCP)4门1453元最热门证书限时免费考

谷歌云(GCP)最新活动&#xff0c;完成免费官方课程&#xff0c;送4门最热门考试免费考试券1张(每张价值200刀/1453元)&#xff0c;这4门也包括最近大热的AI/ML考试&#xff0c;非常值得学习和参加&#xff0c;活动7/17截止 谷歌云是全球最火的三大云计算厂商(前两名AWS, Azure…

MySQL索引优化解决方案--索引失效(3)

索引失效情况 最佳左前缀法则&#xff1a;如果索引了多列&#xff0c;要遵循最左前缀法则&#xff0c;指的是查询从索引的最左前列开始并且不跳过索引中的列。不在索引列上做任何计算、函数操作&#xff0c;会导致索引失效而转向全表扫描存储引擎不能使用索引中范围条件右边的…

【Linux】进程信号_1

文章目录 八、进程信号1.信号 未完待续 八、进程信号 1.信号 信号和信号量之间没有任何关系。信号是Linux系统提供的让用户/进程给其他进程发送异步信息的一种方式。 常见信号&#xff1a; 当信号产生时&#xff0c;可选的处理方式有三种&#xff1a;①忽略此信号。②执行该…

小程序注册

【 一 】小程序注册 微信公众平台 https://mp.weixin.qq.com/ https://mp.weixin.qq.com/注册 邮箱激活 小程序账户注册 微信小程序配置 微信小程序开发流程 添加项目成员 【 二 】云服务 lass 基础设施服务&#xff08;组装机&#xff09; 你买了一大堆的电脑配件&#x…

AI早班车2024.6.25

全球AI新闻速递 1.高通&#xff1a;开放 AI 模型&#xff0c;帮助开发者打造骁龙 X Elite 平台智能应用。 2.OpenAI&#xff1a;收购数据库分析公司Rockset。 3.大众海外版车型支持 ChatGPT。 4.乐聚夸父人形机器人&#xff0c;搭载华为云盘古具身智能大模型。 5.微软正努力…

Day45

Day45 jQuery动画 显示和隐藏 <!DOCTYPE html> <html><head><meta charset"UTF-8"><title></title><script src"js/jquery-1.8.2.js" type"text/javascript" charset"utf-8"></script&…