14 - Vue3 + Cesium配置方案：

（1）安装依赖：

"dependencies": {
    "cesium": "^1.93.0",
    "sass": "^1.70.0",
    "vue": "^3.3.11"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^4.5.2",
    "vite": "^5.0.8",
    "vite-plugin-cesium": "^1.2.22",
    "vue-router": "^4.2.5"
  }

（2）在vite.config.js中添加插件：

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

export default defineConfig({
  plugins: [vue(), cesium()],
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src')
    }
  }
})

（3）添加Home.vue，并引入Cesium，同时去掉Cesium默认组件：

<script setup>
import * as Cesium from 'cesium'
import { onMounted } from 'vue'

onMounted(() => {
  const viewer = new Cesium.Viewer('cesiumContainer', {
    animation: false,   // 动画小组件
    baseLayerPicker: false,  // 底图组件，选择三维数字地球的底图
    fullscreenButton: false,  // 全屏组件
    vrButton: false,    // VR模式
    geocoder: false,    // 地理编码搜索组件
    homeButton: false,  // 首页，点击之后将视图跳转到默认视角
    infoBox: false,     // 信息框
    sceneModePicker: false,  // 场景模式，切换2D、3D和Columbus Views（CV）模式
    selectionIndicator: false,  // 是否显示选取指示器组件
    timeline: false,    // 时间轴
    navigationHelpButton: false,    // 帮助提示，如何操作数字地球
    navigationInstructionsInitiallyVisible: false,
    // 添加地形效果
    // terrain: new Cesium.Terrain.fromWorldTerrain({
    //   url: Cesium.IonResource.fromAssetId(3956),
    //   requestWaterMask: true,    // 请求水体效果所需要的海水波浪数据
    //   requestVertexNormals: true   // 请求地形照明数据
    // })
    // 添加Cesium官方图层
    baseLayer: Cesium.ImageryLayer.fromProviderAsync(
      Cesium.TileMapServiceImageryProvider.fromUrl(
        // 给定 Cesium 基本 URL 下的相对 URL，返回绝对 URL。
        // http://localhost:5173/cesium/Assets/Textures/NaturalEarthII
     Cesium.buildModuleUrl("Assets/Textures/NaturalEarthII"),
      )),
  })
})
</script>

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

<style lang="scss">
#cesiumContainer {
  width: 100vw;
  height: 100vh;
    .cesium-viewer-bottom {
    visibility: hidden;
  }
}
</style>