解决cesium widgets.css is not exported from package

cesium使用ES引入,需要引入样式

import "cesium/Build/Cesium/Widgets/widgets.css";

在版本1.92.0会出现
在这里插入图片描述
这个错误

解决:
在node_modules里找到cesium的package.json文件,在exports里增加导出widgets.css

  "exports": {
    "./package.json": "./package.json",
    "./widgets.css": "./Source/Widgets/widgets.css",
    ".": {
      "require": "./index.cjs",
      "import": "./Source/Cesium.js"
    }
  },

然后引用导出时定义的名称

import "cesium/widgets.css";

如果不想修改,还有另一种方法。
按照cesium正常的安装流程,需要把
node_modules/cesium/Build/Cesium/Workers
node_modules/cesium/Build/Cesium/ThirdParty
node_modules/cesium/Build/Cesium/Assets
node_modules/cesium/Build/Cesium/Widgets
这四个拷到public文件夹下,而需要的widgets.css就在第四个文件夹里。试了下各种引用方法,比较成功的是在index.html里引用,而通过import或require或@import在组件里引用都失败了。
在这里插入图片描述

<link href="<%= BASE_URL %>Cesium/Widgets/widgets.css" rel="stylesheet" />
根据引用\[1\]和引用\[3\]的内容,你在导入Cesium时遇到了报错。报错信息是关于无法导入widgets.css文件。根据引用\[2\]的参考链接,这个问题可能是由于打包工具无法正确导入CesiumCSS文件所致。为了解决这个问题,你可以尝试以下步骤: 1. 确保你已经正确安装了Cesium,并且在项目中引入了Cesium的主要文件。 2. 检查你的打包工具配置,确保它能够正确处理CSS文件的导入。不同的打包工具可能有不同的配置方式,你可以查阅相关文档或搜索相关问题的解决方案。 3. 尝试使用不同的导入方式。根据引用\[3\]的内容,你可以尝试使用import语句来导入CesiumCSS文件,而不是使用require语句。你可以注释掉require语句,然后取消注释import语句,看看是否能够解决问题。 希望这些步骤能够帮助你解决Cesium报错widgets.css的问题。如果问题仍然存在,请提供更多的错误信息或代码片段,以便我们能够更好地帮助你解决问题。 #### 引用[.reference_title] - *1* *2* *3* [Cesium-Vue3.2配置Cesium踩坑笔记](https://blog.csdn.net/Apple_Coco/article/details/124323943)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值