vue3+vite +cesium

在Vue 3 + Vite中使用Cesium的步骤如下：

1. 首先，创建一个Vue项目并安装Vite：

yarn create vite cesiumapp --template vue
cd cesiumapp
yarn install

2. 安装Cesium相关插件：

yarn add cesium vite-plugin-cesium vite -D

3. 在vite.config.js中引入插件：

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import cesium from 'vite-plugin-cesium';

export default defineConfig({
  plugins: [
    vue(),
    cesium()
  ]
});

4. 在App.vue中创建一个Cesium容器并初始化Cesium实例：

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

<script setup>
import { Viewer } from "cesium";
import { onMounted } from "vue";

onMounted(() => {
  const viewer = new Viewer("cesiumContainer");

  // 处理Cesium中iframe的allow-scripts权限问题
  const iframe = document.getElementsByClassName("cesium-infoBox-iframe")[0];  iframe.setAttribute("sandbox", "allow-same-origin allow-scripts allow-popups allow-forms");
  iframe.setAttribute("src", "");
});
</script>

<style>
#cesiumContainer {
  width: 100%;
  height: 500px;
}
</style>

通过以上步骤，您可以在Vue 3 + Vite的项目中成功加载并显示Cesium地球。请注意，上述步骤中的引用和引用是关于安装和配置Cesium相关插件的，而引用是关于在Vue 3 + Vite中加载CesiumHeatmap生成热力图时可能需要对源码进行封装和修改的说明。