查看手机演示
# 说明
该组件库是由本人个人时间进行开发,因为也在工作,更新不定时,框架主要为了处理解决在开发中需要花费长时间的业务功能及需要学习的canvas技术。kanMi-UI具有特色的webGL技术的3D三维组件,后续会陆续更新内容,补充新的业务组件或功能,维护已知框架bug
# 安装
# npm方式安装
npm i kanmi-ui
# 配置
kanMi-UI基于scss/sass编写,请先确认项目已安装该插件,未安装请先操作安装↓
// 安装node-sass
npm i sass -D
// 安装sass-loader
npm i sass-loader -D
# 快速上手
main.js
引入kanmi-ui库
// main.js
import KanMiUI from 'kanmi-ui';
Vue.use(KanMiUI);
pages.json
配置easycom规则(按需引入)
// pages.json
{
"easycom": {
"^k-(.*)": "kanmi-ui/components/k-$1/k-$1.vue"
},
// 此为本身已有的内容
"pages": [
// ......
]
}
- 引入主题scss全局样式
uni.scss
中引入
@import 'kanmi-ui/global.scss';
- 引入布局样式等全局样式
App.vue
中引入
<style lang="scss">
@import 'kanmi-ui/index.scss';
</style>
# 使用方法
配置easycom规则后,自动按需引入,无需import
组件,直接引用即可。
<template>
// 优惠券组件
<k-coupon></k-coupon>
</template>
大转盘 →