Vue集成Bmap离线地图-打dist包问题解决

Vue集成Bmap离线地图-打dist包问题解决继续我上一篇博客 https blog csdn net yc article details 在以 npmrundev 的形式运行时并不会有问题 最近应客户要求 需要给打包成 dist 静态访问的形式 但是通过打 dist 包的时候 由于资源路径变化了 会导致地图的功能资源文件加载异常等问题 问题的根本原因 bmap js 的加载时是以静态资源的形式加载的

继续我上一篇博客:https://blog.csdn.net/yc/article/details/
在以npm run dev的形式运行时并不会有问题。

最近应客户要求,需要给打包成dist静态访问的形式,但是通过打dist包的时候,由于资源路径变化了,会导致地图的功能资源文件加载异常等问题。

问题的根本原因:














  1. bmap.js的加载时是以静态资源的形式加载的,根本原因在于,如果将庞大的瓦片打包到vue项目中,会耗费巨量的时间。所以我无法在bmap.js中写相对路径或者写require的形式去获取地图资源。
  2. 我在上篇博客的资源包中的路径是从绝对路径开始写起的,如地图瓦片路径:maptitleUrl + “/17/23232.png”。maptitleUrl = “/static/BMap/maptitle” 在以服务器运行的时候,maptitleUrl 等价为”localhost:port/static/BMap/maptitle”,但是在打了dist包后,那么如果直接运行在linux或者windows,那么maptitleUrl等价直接指向磁盘的根目录开始即:D:/static/BMap/maptitle
  3. 对应有jsUrl,libUrl,imageUrl等,在getmodule.js中同理,注,此处的变量简称,只是代称,在bmap.js中我直接替换的路径,并没有抽象出来。



知道问题的根源了,那么就是改api的问题了,api我改好了,在此下载。

import "../static/BMap/js/bmap_pack.js"; 

然后打dist包

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/221868.html原文链接:https://javaforall.net

(0)
上一篇 2026年3月17日 下午5:06
下一篇 2026年3月17日 下午5:06


相关推荐

  • MYSQL数据类型_c语言数据类型详解

    MYSQL数据类型_c语言数据类型详解上一篇博客中我们学习了MySQL的基础知识以及表结构的相关操作,知道了MySQL中常用的数据类型有数值型、字符串型、日期时间类型下面我们来使用一下这些数据类型。数值类型首先数值类型分为整型和浮点型我们先来看看整型整型首先创建一个表CREATETABLEint_db(aTINYINT,bSMALLINT,cMIDDLEINT,dINT,eB…

    2026年2月5日
    7
  • 微搭低代码平台集成腾讯云知识引擎、DeepSeek与豆包大模型的完整实践指南

    微搭低代码平台集成腾讯云知识引擎、DeepSeek与豆包大模型的完整实践指南

    2026年3月12日
    1
  • FCN语义分割_卷积神经网络可用于分割吗

    FCN语义分割_卷积神经网络可用于分割吗1.FCN概述图像的语义分割则不仅是区分每个像素的前后景,更需要将其所属类别预测出来,属于计算机视觉领域。CNN做图像分类甚至做目标检测的效果已经被证明并广泛应用,图像语义分割本质上也可以认为是稠密的目标识别(需要预测每个像素点的类别)。传统的基于CNN的语义分割方法是:将像素周围一个小区域(如25*25)作为CNN输入,做训练和预测。这样做有3个问题: -像素区域的大小如何确定 -存储及计算…

    2022年8月21日
    9
  • QT GUI编程

    QT GUI编程QT 程序设计 一 QT 基础 Qt 简介 Qt 应用范围开发环境 QtCreator 安装 Qt 内存管理第一个 Qt 程序打印跟踪信号与槽二 窗口部件三 主窗口四 QT 基础五 QT 基础六 QT 基础七 QT 基础持续更新中 一 QT 基础 Qt 简介 Qt 应用范围开发环境 QtCreator 安装 Qt 内存管理第一个 Qt 程序打印跟踪信号与槽二 窗口部件三 主窗口四 QT 基础五 QT 基础六 QT 基础七 QT 基础持续更新中

    2026年3月26日
    3
  • 发送udp数据包

    发送udp数据包nbsp 在 Socket 编程中 发送数据报文可供使用的 API 函数有 send sendto 和 sendmsg 下面是关于前两个系统调用的原型 includessize tsend intsocket constvoid buffer size tlength intflags nbsp nbsp nbsp nbsp 请注意它的返回值的类型 ssize t 其含义是 signedsize 从内核代码中 我们可以看

    2026年3月18日
    2
  • Lucene分词报错:”TokenStream contract violation: close() call missing”

    Lucene分词报错:”TokenStream contract violation: close() call missing”Lucene使用IKAnalyzer分词时报错:”TokenStreamcontractviolation:close()callmissing”解决办法是每次完成后必须调用关闭方法。如果报错:java.lang.illegalstateexception:tokenstreamcontractviolation:reset()/close()callmissing,…

    2022年7月22日
    21

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号