首页 / 浏览问题 / 三维GIS / 问题详情
@supermap/iclient3d-vue-for-webgl无法使用
1EXP 2022年10月14日
npm install @supermap/iclient3d-vue-for-webgl安装成功, 在main.ts文件里面引入 // 引入webgl3d组件包 import '@supermap/iclient3d-vue-for-webgl/lib/theme/index.css' import webgl3d from "@supermap/iclient3d-vue-for-webgl" app.use(webgl3d) 运行项目报错,如下 [plugin:vite:import-analysis] Failed to resolve import "@supermap/iclient3d-vue-for-webgl/lib/theme/index.css" from "src\main.ts". Does the file exist? 提示找不到@supermap/iclient3d-vue-for-webgl/lib/theme/index.css,经确认node_modules包管理里面确实没有@supermap/iclient3d-vue-for-webgl/lib/theme/index.css文件
问题关闭原因: supermap/iclient3d-vue-for-webg组件包跟node版本有关系,后来使用自己的mac根据官网示例创建vue3+vite3项目是可以正常运行的

1个回答

您好,

您这边使用的是2.0还是3.0的VUE呢?

2.0的话您根据我们官方的博客去进行安装即可:

https://blog.csdn.net/supermapsupport/article/details/123850171

3.0的话建议您这边参考这个:

https://blog.csdn.net/supermapsupport/article/details/119785454

另外,不要把两个产品搞混。

SuperMap_iClient3D_VUE_for_WebGL和 SuperMap iClient3D for WebGL 的安装不一样的。

4,151EXP 2022年10月14日
您好,分享链接:https://pan.baidu.com/s/1aVA7QDUOR7cOnBWZbmbaXw
提取码:sm17
--来自百度网盘超级会员V4的分享
您好,

这个报错是vite+vue3在引入css时经常出现的问题

引入时的css的路径您需要再次确定一下

或者您把theme文件夹复制到index.html同级的public目录下,然后使用

public/theme/index.css 这个路径去调用
您好,问题是npm安装的,node_modules包管理里面都找不到@supermap/iclient3d-vue-for-webgl/lib/theme/index.css,lib文件夹里面都没有theme/index.css,依赖又需要,上面我问的一直也是找不到@supermap/iclient3d-vue-for-webgl/lib/theme/index.css的问题哦
方便远程吗,或者您私信我一个联系方式,QQ或者微信。
1.使用npm组件库及UI依赖: npm install @supermap/iclient3d-vue-for-webgl  element-plus -D
2. 在node_module里找到组件包,复制node_module/@supermap/iclient3d-vue-for-webgl/public/Cesium文件夹到项目根目录下的public文件夹中
3. 在 index.html 中:
<link href="Cesium/Widgets/widgets.css" rel="stylesheet">
<script src="Cesium/Cesium.js" ></script>
4.引入 Vue-iClient3D-WebGL在 main.js 中:
// 引入ui依赖
import ElementPlus from 'element-plus';
import 'element-plus/lib/theme-chalk/index.css';
app.use(ElementPlus)
// 引入webgl3d组件包
import '@supermap/iclient3d-vue-for-webgl/lib/theme/index.css'
import webgl3d from "@supermap/iclient3d-vue-for-webgl"
app.use(webgl3d)
5.测试在App.vue里测试代码:
<sm3d-viewer scene-url="http://www.supermapol.com/realspace/services/3D-ZF_normal/rest/realspace"><sm3d-measure></sm3d-measure></sm3d-viewer>

如果包有问题则下载最新的webgl包, 将WebGL包中的Build文件夹中的Cesium文件夹拷贝到static目录,进行替换即可
...