Vue3+Vite 初始化Cesium

Vue3+Vite 初始化Cesium

安装依赖

js 复制代码
yarn add cesium
yarn add vite-plugin-cesium -D

加载vite-plugin-cesium插件

js 复制代码
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import cesium from 'vite-plugin-cesium';
 
 
export default defineConfig({
  plugins: [vue(),cesium()]
});

初始化Cesium

js 复制代码
<template>
	<div id="map"></div>
</template>

<script lang="ts" setup>
import { onMounted } from 'vue'
import * as Cesium from 'cesium'

onMounted(() => {
	const viewer = new Cesium.Viewer('map')
	window.viewer = viewer
})
</script>

<style lang="scss" scoped>
#map {
	width: 100%;
	height: 100%;
}
</style>

git

相关推荐
yivifu1 天前
JavaScript Selection API详解
java·前端·javascript
这儿有一堆花1 天前
告别 Class 组件:拥抱 React Hooks 带来的函数式新范式
前端·javascript·react.js
Zyx20071 天前
深拷贝:JavaScript 中对象复制的终极解法
javascript
开发者小天1 天前
React中的componentWillUnmount 使用
前端·javascript·vue.js·react.js
sunly_1 天前
Flutter:视频预览功能
javascript·flutter·音视频
杰克尼1 天前
vue_day04
前端·javascript·vue.js
小皮虾1 天前
小程序云开发有类似 uniCloud 云对象的方案吗?有的兄弟,有的!
前端·javascript·小程序·云开发
阳懿1 天前
meta-llama-3-8B下载失败解决。
前端·javascript·html
史林枫1 天前
JavaScript 中call和apply的详细讲解 —— 连10岁的小朋友都能看懂!
javascript·apply·call
紫小米1 天前
Vue 2 和 Vue 3 的区别
前端·javascript·vue.js