Question

使用产品：iclient 10i

问题详细描述：从基于Vue快速搭建超图二维iClient开发环境_supermapsupport的博客-CSDN博客下载的Leaflet示例程序，尝试运行报错

[vue warn]: Error in mounted hook : "TypeError: Cannot read properties of undefined(reading 'tiledMapLayer')

问题重现步骤：

1.

<template>
  <div id="map"></div>
</template>

<script>
import L from "leaflet";
import "@supermap/iclient-leaflet";

export default {
  name: "HelloWorld",
  props: {
    msg: String,
  },
  methods: {
    mapInit() {
      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,
      });
      L.supermap.tiledMapLayer(url).addTo(map);
    },
  },
  mounted() {
    this.mapInit();
  },
};
</script>


<style scoped>
#map {
  margin: 0;
  overflow: hidden;
  background: #fff;
  width: 100%;
  height: 100%;
  position: absolute;
}
</style>

Answer 1

您好，根据您截图中的报错信息，可以判断是您项目中加载 SuperMap iClient For Leaflet 库没有成功的原因，建议您从一下位置检测：

1. 在项目 node_modules 目录下检测 "@supermap" 目录是否存在；
2. 检测 "@supermap" 目录下的 "iclient-common" 和 "iclient-leaflet" 内容是否完整；
3. 检测 npm install 的时候是否存在异常，是否有部分包因为网络或其他原因导致下载失败；
4. 建议移除已存在的 node_modules 目录，通过 cnpm install 重新下载运行环境，确保不会因为网络或其他原因影响导致下载的包不完整。

希望可以帮到您。

Comments

您好，您遇到的这个问题的确是引入 SuperMap 包时出的异常，建议您参考该贴子的上述解决方案，确认node_modules中的 SuperMap for Leaflet 包是否完整；若已确认下载完整，则建议您删除当前项目的编译输出目录后重新编译看看；若还是存在该问题，建议您将您的项目结构以及引入 SuperMap for Leaflet 的代码和使用 SuperMap for Leaflet 扩展的代码截图贴上来，以便更好的分析造成该问题的原因以及为您提供解决方案。

---

vue3,nodejs16+,是可以使用的吗，L上是没有supermap的，和上面一样的问题

---

您好，建议您将您的示例项目通过邮件（liuchengxian@supermap.com）发给我，我运行看看无法识别supermap模块的原因。

---

我也有这个问题，问题解决了吗

---

我解决了，单独引入包

import {

  TiledMapLayer,

  TiandituTileLayer,

  TileVectorLayer,

  MapService,

  crsFromMapJSON,

} from '@supermap/iclient-leaflet'，并且leaflet 要在main.js 引入，supermap leaflet 在组件引入

Answer 2

只需要npm iclient-leaflet就行，里面附带有leaflet,不需要npm leaflet。兵器在卸载leaflet时候不要直接只卸载leaflet，把leaflet和iclient-leaflet都uninstall之后，再只npm iclient-leaflet，我的就可以使用了，可以看看这样是否也可以。