基于vue3的marsgis通用UI库 mars-ui 的使用

如果使用marsgis+vue的相关产品,mars-ui的使用一定需要了解,mars-ui是火星科技针对gis应用场景定制的一套ui框架,其中基础组件是在antdv的基础之上做的二次封装。使用方式和参数与antdv基本一致。marsui除了在火星科技的项目中使用之外,也可以单独应用于其他基于vue3.0的项目,只需要将源码拷贝到自己的项目中然后做一些简单的配置即可。下面以vite+vue3.0项目为例,对mars-ui的使用和配置进行说明

  1. 复制mars-ui到项目的components文件夹下

  1. 配置按需引入

按需引入有多种方式,这里使用`vite-plugin-style-import`,(如果是webpack的项目可以使用 `babel-import-plugin`)

import { createStyleImportPlugin, AndDesignVueResolve } from "vite-plugin-style-import"

// 在vite的plugins 数组中添加
createStyleImportPlugin({
  resolves: [AndDesignVueResolve()],
  libs: [
    {
      libraryName: "ant-design-vue",
      esModule: true,
    
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值