vue+cesium开发环境配置

以下是使用Vue和Cesium配置开发环境的步骤：

1. 首先，确保你已经安装了最新版本的Vue CLI。你可以使用以下命令来检查Vue CLI的版本：

vue --version

2. 如果你还没有安装Vue CLI，可以使用以下命令来全局安装Vue CLI：

npm install -g @vue/cli

3. 创建一个新的Vue项目。你可以使用以下命令来创建一个新的Vue项目：

vue create my-cesium-project

4. 进入到项目目录中：

cd my-cesium-project

5. 安装Cesium和相关的依赖。你可以使用以下命令来安装Cesium和vite-plugin-cesium：

npm install cesium vite-plugin-cesium

6. 在项目的根目录下创建一个vite.config.js文件，并添加以下内容：

import { defineConfig } from 'vite';
import cesium from 'vite-plugin-cesium';

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

7. 在项目的根目录下创建一个.vue文件，例如App.vue，并在其中引入Cesium的相关组件和样式：

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

<script>
import { Viewer } from 'cesium/Source/Cesium';

export default {
  mounted() {
    const viewer = new Viewer('cesiumContainer');
  },
};
</script>

<style>
@import url('cesium/Build/Cesium/Widgets/widgets.css');

#cesiumContainer {
  height: 400px;
}
</style>

8. 在项目的根目录下运行以下命令来启动开发服务器：

npm run dev

9. 打开浏览器并访问http://localhost:3000，你将看到一个包含Cesium地球的页面。