tdesign-miniprogram-taro
v0.0.4 tdesign miniprogram taro
TDesign 适配微信小程序的组件库 For Taro。
预览
小程序组件示例小程序,请使用微信扫码预览 ↓
关于
当前项目 fork 自 TDesign 官方,为了方便支持 Taro 开发,做了细微调整,但整体上升级会持续与官方保持一致。
安装
npm i tdesign-miniprogram-taro -S --production
配置
编译配置
在 taro 根目录中找到 config/index.js
,为 config
添加 copy
属性:
const OUTPUT_PATH = `build/${process.env.TARO_ENV}`;
// ...
const config = {
// ...
outputRoot: OUTPUT_PATH,
// ...
copy: {
patterns: [
{
from: `node_modules/tdesign-miniprogram-taro/miniprogram_dist/`,
to: `${OUTPUT_PATH}/miniprogram_npm/tdesign-miniprogram/`,
ignore: ['*.ts', '*.map', 'type.js']
},
],
},
// ...
};
小程序配置
在 taro 根目录中找到 src/app.config.js
,为 config
添加 usingComponents
属性:
usingComponents: {
't-button': 'tdesign-miniprogram/button/button',
't-button-group': 'tdesign-miniprogram/button-group/button-group',
't-icon': 'tdesign-miniprogram/icon/icon',
't-avatar': 'tdesign-miniprogram/avatar/avatar',
't-avatar-group': 'tdesign-miniprogram/avatar/avatar-group',
't-badge': 'tdesign-miniprogram/badge/badge',
't-cell': 'tdesign-miniprogram/cell/cell',
't-count-down': 'tdesign-miniprogram/count-down/count-down',
't-divider': 'tdesign-miniprogram/divider/divider',
't-empty': 'tdesign-miniprogram/empty/empty',
't-footer': 'tdesign-miniprogram/footer/footer',
't-grid': 'tdesign-miniprogram/grid/grid',
't-grid-item': 'tdesign-miniprogram/grid/grid-item',
't-image': 'tdesign-miniprogram/image/image',
't-swiper': 'tdesign-miniprogram/swiper/swiper',
't-swiper-item': 'tdesign-miniprogram/swiper/swiper-item',
't-swiper-nav': 'tdesign-miniprogram/swiper/swiper-nav',
't-skeleton': 'tdesign-miniprogram/skeleton/skeleton',
't-sticky': 'tdesign-miniprogram/sticky/sticky',
't-tag': 'tdesign-miniprogram/tag/tag',
't-checkbox': 'tdesign-miniprogram/checkbox/checkbox',
't-date-time-picker': 'tdesign-miniprogram/date-time-picker/date-time-picker',
't-input': 'tdesign-miniprogram/input/input',
't-picker': 'tdesign-miniprogram/picker/picker',
't-picker-column': 'tdesign-miniprogram/picker/picker-column',
't-radio': 'tdesign-miniprogram/radio/radio',
't-rate': 'tdesign-miniprogram/rate/rate',
't-search': 'tdesign-miniprogram/search/search',
't-slider': 'tdesign-miniprogram/slider/slider',
stepper: 'tdesign-miniprogram/stepper/stepper',
't-switch': 'tdesign-miniprogram/switch/switch',
't-textarea': 'tdesign-miniprogram/textarea/textarea',
't-upload': 'tdesign-miniprogram/upload/upload',
't-indexes': 'tdesign-miniprogram/indexes/indexes',
't-navbar': 'tdesign-miniprogram/navbar/navbar',
't-steps': 'tdesign-miniprogram/steps/steps',
't-step': 'tdesign-miniprogram/steps/step-item',
't-tab-bar': 'tdesign-miniprogram/tab-bar/tab-bar',
't-tab-bar-item': 'tdesign-miniprogram/tab-bar/tab-bar-item',
't-tabs': 'tdesign-miniprogram/tabs/tabs',
't-back-top': 'tdesign-miniprogram/back-top/back-top',
't-dialog': 'tdesign-miniprogram/dialog/dialog',
't-loading': 'tdesign-miniprogram/loading/loading',
't-message': 'tdesign-miniprogram/message/message',
't-popup': 'tdesign-miniprogram/popup/popup',
't-pull-down-refresh': 'tdesign-miniprogram/pull-down-refresh/pull-down-refresh',
't-swipe-cell': 'tdesign-miniprogram/swipe-cell/swipe-cell',
't-toast': 'tdesign-miniprogram/toast/toast',
},
npm i tdesign-miniprogram-taro
Homepage
github.com/pillys/tdesign-mi...Metadata
- MIT
- Whatever
- tdesign
- released 1/11/2022