关于SuperMap iClient for Leaflet+Vue的报错及解决过程

项目场景：

前段时间想学习一下Leaflet，于是就在Vue项目中引入了SuperMap iClient for Leaflet，由于是第一次接触就完全按照官方步骤一步一步操作，结果项目一启动浏览器就报错。今天看到有朋友私信问我是否解决，我就想着写一篇文章简单总结一下。

---

问题描述

主要就是两个错误：

1.Cannot read properties of undefined (reading 'TiledMapLayer')

 2. Cannot read properties of undefined (reading 'lat')

---

解决方案：

问题一：Cannot read properties of undefined (reading 'TiledMapLayer')

        针对问题一我想大部分朋友一定是跟我一样用了官方教程中的“ 全模块引入”方法导致的，如果不是那就需要检查一下依赖包是否安装成功。我最后的解决办法就是采用如下“部分模块引入”的方法，问题一的报错果然就没有了，至于为什么按照官方的全模块引入会报这个错误，我在超图社区看到的回答都是让再检查引入方式以及环境配置等，在CSDN上看到一篇文章是说：“11.0版本以上的超图Leaflet依赖包不支持全模块引入了”。不过不管是什么原因这个报错采用部分模块引入的方法就可以解决，而且部分模块引入会使项目打包和运行速度更快。

        顺便提一句：使用Vue3的朋友要注意一定不要忘了要将地图加载的方法（L.map）写在“onMounted”钩子中，否则组件还未渲染就会导致找不到“map”的DOM从而报——Map container not found的错误。

var L = require('leaflet');
var TiledMapLayer = require('@supermap/iclient-leaflet').TiledMapLayer;

var url = "https://iserver.supermap.io/iserver/services/map-world/rest/maps/World";
var map = L.map('map', {
    crs: L.CRS.EPSG4326,
    center: [0, 0],
    maxZoom: 18,
    zoom: 1
});
TiledMapLayer(url).addTo(map);

问题二：Cannot read properties of undefined (reading 'lat')

        在我解决完问题一后本以为就能看到地图了，结果没想到浏览器又报了Cannot read properties of undefined (reading 'lat')的错误，检查了半天也没找到问题所在，搜了很多方法，有的说是引入问题，有的说是config文件配置问题，有的说是依赖包问题，逐一尝试之后依旧没有解决，最后看到超图问答社区有说重新卸载安装几次依赖包之后就好了，于是我就抱着试一试的心态果然成功了。

以下是我解决后回复的评论仅供大家参考：

至于为什么会出现这种情况，超图社区大佬回复：“npm多次安装成功的话可能是网络情况哦，使用npm安装的话 leaflet本身不需要手动安装的，仅npm iclient for leaflet就可以。”