Umi+Dva搭建Cesium 3D開發環境


umi,中文可發音為烏米,是一個可插拔的企業級 react 應用框架,是螞蟻金服的底層前端框架,已直接或間接地服務了 600+ 應用,包括 java、node、H5 無線、離線(Hybrid)應用、純前端 assets 應用、CMS 應用等。(具體可前往Umijs官網進行查看https://umijs.org/)

dva 首先是一個基於 redux 和 redux-saga 的數據流方案,然后為了簡化開發體驗,dva 還額外內置了 react-router 和 fetch,所以也可以理解為一個輕量級的應用框架。(https://dvajs.com/guide/)

首先搭建umi+dva前端開發環境:

第一步:創建一個項目文件夾

創建文件目錄

第二步:使用命令行創建umi應用:

yarn create umi

創建umi應用
選擇->app,按回車進行下一步
typescript選擇

選擇項目中是否需要使用typescript語言,看個人情況進行選擇

第三步:選擇項目中使用的插件,這里是具體情況而定,本項目選擇antd 前端UI框架,dva插件以及code-spliting代碼分割插件。注意這是多選,使用空格鍵進行選擇,按回車鍵進行下一步。

選擇項目中需要使用的插件

第四步:安裝項目中所需依賴

yarn install / npm install

第五步:cesium插件安裝。

yarn add cesium / npm install cesium

第六步:cesium配置。

首先在.umirc.js文件中添加以下常量

cesium路徑

在配置輸出對象中添加webpack-chain copy配置
webpack-chain copy

配置完成后在主路由中使用

主路由中添加BaseUrl設置

cesium組件View的使用

項目啟動后即可成功,至此umi+dva+cesium的開發環境搭建成功了

demo示例

dva,umi


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM