一款轻量级、模块化基于 Vue3.x 的 H5 前端 UI 组件库 👍
- 丰富的模块化组件和组合式 API，60+ 个组件
- 支持按需加载，
tree-shaking优化 - 完善的组件使用文档和演示示例
- 内置每个组件的单元测试
- 多页面配置
- 支持移动端预览
- 支持
PWA - 支持
TypeScript - 版本更新日志
- 开发指南
npm i mine-h5-uiimport { createApp } from 'vue'
import App from './App.vue'
import mineh5ui from 'mine-h5-ui'
import 'mine-h5-ui/styles/index.css'
createApp(App).use(mineh5ui).mount('#app')- 👉 在快速开始中查看更多信息。
git clone https://github.com/biaov/mine-h5-ui.git --depth=1- 项目根目录安装项目依赖
npm inpm start- 打包组件库文档和组件库
npm run buildVite+Vue3.x+TypeScript+Less+Gulp+Vitest
├── mine-h5-ui -------------------------------- 组件库名称
│ ├── .husky -------------------------------- Git 操作时自动触发脚本
│ ├── .vscode ------------------------------- VSCode 配置
│ ├── config -------------------------------- 配置文件
│ ├── dist ---------------------------------- 打包后的文件
│ ├── examples ------------------------------ 组件库文档
│ │ ├── assets ---------------------------- 静态资源
│ │ ├── components ------------------------ 组件库文档组件
│ │ ├── config ---------------------------- 配置文件
│ │ ├── docs ------------------------------ 组件库文档主页面 Markdown 文件
│ │ ├── router ---------------------------- 路由
│ │ ├── styles ---------------------------- 样式
│ │ ├── utils ----------------------------- 工具
│ │ ├── views ----------------------------- 组件库文档页面
│ │ ├── App.vue --------------------------- 组件库文档主页面
│ │ └── main.ts --------------------------- 组件库文档入口文件
│ ├── mobile -------------------------------- 移动端组件库文档
│ │ ├── assets ---------------------------- 静态资源
│ │ ├── components ------------------------ 组件库文档组件
│ │ ├── router ---------------------------- 路由
│ │ ├── views ----------------------------- 组件库文档页面
│ │ ├── App.vue --------------------------- 组件库文档主页面
│ │ └── main.ts --------------------------- 组件库文档入口文件
│ ├── node_modules -------------------------- 依赖包
│ ├── packages ------------------------------ 组件库组件
│ ├── public -------------------------------- 静态资源
│ ├── scripts ------------------------------- 脚本
│ ├── tests --------------------------------- 测试
│ ├── typings ------------------------------- 类型
│ ├── .editorconfig ------------------------- 编辑器配置
│ ├── .eslintignore ------------------------- Eslint 忽略文件
│ ├── .eslintrc.js -------------------------- Eslint 配置
│ ├── .gitignore ---------------------------- Git 忽略文件
│ ├── .ncurc.json --------------------------- NCU 配置
│ ├── .npmignore ---------------------------- NPM 忽略文件
│ ├── .prettierignore ----------------------- Prettier 忽略文件
│ ├── index.html ---------------------------- 组件库文档入口文件
│ ├── LICENSE ------------------------------- 授权协议
│ ├── mobile.html --------------------------- 移动端组件库文档入口文件
│ ├── package-lock.json --------------------- 依赖包版本锁定文件
│ ├── package.json -------------------------- 依赖包配置文件
│ ├── README.md ----------------------------- 项目文档
│ ├── RELEASE.md ---------------------------- 发布文档
│ ├── tsconfig.json ------------------------- TS 配置
│ ├── vite.config.ts ------------------------ Vite 配置
└ └── vitest.config.ts ---------------------- Vitest 配置clipboard: 剪切板html2canvas: 截屏mockjs: 模拟数据qrcode: 二维码vue: 前端框架vue-router: 路由
@types/mockjs:mockjs的类型@types/node:node的类型@types/postcss-pxtorem:postcss-pxtorem的类型@types/qrcode:qrcode的类型@typescript-eslint/eslint-plugin: 检测和修复 TS 代码@typescript-eslint/parser: 解析 TS 代码并生成抽象语法树（AST），以供 Eslint 进行代码检查@vitejs/plugin-vue: Vite 解析 Vue 文件@vue/compiler-sfc: 编译 Vue 单文件组件@vue/test-utils: 单元测试和集成测试autoprefixer: 添加浏览器厂商前缀eslint: 代码检查工具eslint-config-airbnb-base: airbnb-base 代码编写规范eslint-config-prettier: 将 Prettier 规则集成到 ESlint 检查中eslint-plugin-import: 检测和修复 JS 中的模块导入导出问题eslint-plugin-prettier: 检测不符合 Prettier 格式的代码eslint-plugin-vue: 检测和修复 Vue 代码autoprefixer: 使用 Gulp 添加浏览器厂商前缀husky: Git 操作时自动触发脚本jsdom: 模拟浏览器环境less: CSS 预编译器markdown-it-container: Markdown 解析器postcss-pxtorem: 生成 Rem 的 Postcss 插件prettier: 代码格式化shiki: Markdown 代码高亮tslib: TS 库tailwindcss: 根据 html class 生成样式typescript: 编程语言unplugin-vue-markdown: 解析 Markdown 文件的 Vite 插件vite: 项目构建工具vite-plugin-dts: 生成.d.ts文件的 Vite 插件vite-plugin-eslint: 检查代码格式的 Vite 插件vite-plugin-pwa: 生成 PWA 的 Vite 插件vitest: JS 测试框架vue-tsc: 编译 TS 单文件 Vue 文件的工具
@rollup/rollup-linux-x64-gnu: 支持 Linux 环境运行 Rollup
![dependabot[bot] avatar](https://avatars.githubusercontent.com/in/29110?v=4 "dependabot[bot]")
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "github-actions[bot]")
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent