enn-range-picker (Standalone)

Vue 3 项目中零依赖使用 [email protected] 的 RangePicker。
本包会在运行时自动从 CDN 加载 ant-design-vue@2 与 moment（仅需宿主有 vue@3 且启用 @vue/compat）。

使用

pnpm add enn-range-picker
# Vue3 项目需启用 @vue/compat
pnpm add -D @vue/compat

vite.config.ts

export default {
  resolve: { alias: [{ find: 'vue', replacement: '@vue/compat' }] }
}

组件示例：

<script setup>
import { ref } from 'vue'
import EnnRangePicker from 'enn-range-picker'
import 'enn-range-picker/style.css' // 可选：我们也会自动注入 antd 样式
const range = ref(null)
</script>

<template>
  <EnnRangePicker v-model="range" :showTime="true" format="YYYY-MM-DD HH:mm:ss" />
</template>

说明

• 本包会按需懒加载：首次渲染时从 CDN 拉取 [email protected] 与 [email protected] 的 ESM（通过 esm.sh）。
• 为避免多 Vue 实例，本包不会内置 vue；需要宿主使用 @vue/compat 运行 antdv@2。
• 如果你的网络限制外网，可改源码中的 CDN 地址（cdnImports 部分）为公司内网镜像。

Props

• v-model (modelValue)：范围数组
• valueType: 'string' | 'number' | 'date' | 'moment'（默认 'string'）
• format: 默认 'YYYY-MM-DD'
• 透传：showTime、allowClear、placeholder（['开始日期','结束日期']）、separator（→）、localeCode（zh-cn）、disabledDate

许可证

MIT © zht