使用vite+vue3.0 创建一个cesium基础应用 ----01 项目搭建
创始人
2024-05-28 15:33:22

使用vite+vue3.0 创建一个cesium基础应用 ----01 项目搭建

1.使用yarn创建一个vite项目

  1. 我们可以在vite官网找到vite创建项目的命令 https://cn.vitejs.dev/
    vite官网
  2. 可以使用yarn创建项目使用yarn创建项目的方法
  3. 选择使用vue3.0框架,语言使用js 创建完成后结构如下:文档结构

2.找到vite社区中的cesium插件

1.前往官网中的cesium插件
官方插件
2.前往社区
社区插件
找到cesium插件
4.进入cesium社区
在这里插入图片描述

3.使用vite文档中的线上方式引用cesium的文档

  1. 在项目中安装cesium
npm i cesium vite-plugin-cesium vite -D
# yarn add cesium vite-plugin-cesium vite -D
  1. 在vite.config.js中引入cesium
    引入cesium
import { defineConfig } from 'vite';
import cesium from 'vite-plugin-cesium';
export default defineConfig({plugins: [cesium()]
});
  1. 在APP.vue文件中首次调用cesium vue页面完整代码如下
    调用cesium

4.运行项目,初始效果如下:

初始效果

相关内容

热门资讯

南钢股份申请煤气监控系统相关专... 7月22日消息,国家知识产权局信息显示,南京钢铁股份有限公司申请一项名为“一种煤气区域智能报警可视化...
南钢股份申请带钢板型控制方法相... 7月22日消息,国家知识产权局信息显示,南京钢铁股份有限公司申请一项名为“一种超高强带钢的板型控制方...
山东钢铁取得联轴器找正支架相关... 7月22日消息,国家知识产权局信息显示,山东钢铁股份有限公司申请一项名为“一种联轴器找正定位旋转支架...
调研速递|东山精密接待易方达等... 苏州东山精密制造股份有限公司(以下简称“东山精密”)于2026年7月21日下午通过线上会议形式接待了...
本钢板材取得高强钢相关专利,调... 7月22日消息,国家知识产权局信息显示,本钢板材股份有限公司申请一项名为“一种汽车用420MPa级镀...