Package Exports
- tdesign-vue-next
- tdesign-vue-next/cjs/index-lib.js
- tdesign-vue-next/es/index.mjs
- tdesign-vue-next/es/style/index.css
- tdesign-vue-next/esm/_common/js/global-config/locale/en_US.js
- tdesign-vue-next/esm/_common/js/global-config/locale/zh_CN.js
- tdesign-vue-next/esm/affix
- tdesign-vue-next/esm/affix/index.js
- tdesign-vue-next/esm/alert
- tdesign-vue-next/esm/alert/index.js
- tdesign-vue-next/esm/anchor
- tdesign-vue-next/esm/anchor/index.js
- tdesign-vue-next/esm/avatar
- tdesign-vue-next/esm/avatar/index.js
- tdesign-vue-next/esm/badge
- tdesign-vue-next/esm/badge/index.js
- tdesign-vue-next/esm/breadcrumb
- tdesign-vue-next/esm/breadcrumb/index.js
- tdesign-vue-next/esm/button
- tdesign-vue-next/esm/button/index.js
- tdesign-vue-next/esm/calendar
- tdesign-vue-next/esm/calendar/index.js
- tdesign-vue-next/esm/card
- tdesign-vue-next/esm/card/index.js
- tdesign-vue-next/esm/cascader
- tdesign-vue-next/esm/cascader/index.js
- tdesign-vue-next/esm/checkbox
- tdesign-vue-next/esm/checkbox/index.js
- tdesign-vue-next/esm/collapse
- tdesign-vue-next/esm/collapse/index.js
- tdesign-vue-next/esm/comment
- tdesign-vue-next/esm/comment/index.js
- tdesign-vue-next/esm/config-provider
- tdesign-vue-next/esm/config-provider/index.js
- tdesign-vue-next/esm/date-picker
- tdesign-vue-next/esm/date-picker/index.js
- tdesign-vue-next/esm/dialog
- tdesign-vue-next/esm/dialog/index.js
- tdesign-vue-next/esm/dialog/plugin
- tdesign-vue-next/esm/dialog/plugin.js
- tdesign-vue-next/esm/divider
- tdesign-vue-next/esm/divider/index.js
- tdesign-vue-next/esm/drawer
- tdesign-vue-next/esm/drawer/index.js
- tdesign-vue-next/esm/dropdown
- tdesign-vue-next/esm/dropdown/index.js
- tdesign-vue-next/esm/form
- tdesign-vue-next/esm/form/index.js
- tdesign-vue-next/esm/grid
- tdesign-vue-next/esm/grid/index.js
- tdesign-vue-next/esm/guide
- tdesign-vue-next/esm/guide/index.js
- tdesign-vue-next/esm/hooks/tnode
- tdesign-vue-next/esm/hooks/tnode.js
- tdesign-vue-next/esm/hooks/useConfig
- tdesign-vue-next/esm/hooks/useConfig.js
- tdesign-vue-next/esm/hooks/useDefaultValue
- tdesign-vue-next/esm/hooks/useDefaultValue.js
- tdesign-vue-next/esm/hooks/useGlobalIcon
- tdesign-vue-next/esm/hooks/useGlobalIcon.js
- tdesign-vue-next/esm/hooks/useVModel
- tdesign-vue-next/esm/hooks/useVModel.js
- tdesign-vue-next/esm/image-viewer
- tdesign-vue-next/esm/image-viewer/index.js
- tdesign-vue-next/esm/input
- tdesign-vue-next/esm/input-adornment
- tdesign-vue-next/esm/input-adornment/index.js
- tdesign-vue-next/esm/input-number
- tdesign-vue-next/esm/input-number/index.js
- tdesign-vue-next/esm/input/index.js
- tdesign-vue-next/esm/jumper
- tdesign-vue-next/esm/jumper/index.js
- tdesign-vue-next/esm/layout
- tdesign-vue-next/esm/layout/index.js
- tdesign-vue-next/esm/link
- tdesign-vue-next/esm/link/index.js
- tdesign-vue-next/esm/list
- tdesign-vue-next/esm/list/index.js
- tdesign-vue-next/esm/loading
- tdesign-vue-next/esm/loading/index.js
- tdesign-vue-next/esm/loading/plugin
- tdesign-vue-next/esm/loading/plugin.js
- tdesign-vue-next/esm/menu
- tdesign-vue-next/esm/menu/index.js
- tdesign-vue-next/esm/message
- tdesign-vue-next/esm/message/index.js
- tdesign-vue-next/esm/message/plugin
- tdesign-vue-next/esm/message/plugin.js
- tdesign-vue-next/esm/notification
- tdesign-vue-next/esm/notification/index.js
- tdesign-vue-next/esm/notification/plugin
- tdesign-vue-next/esm/notification/plugin.js
- tdesign-vue-next/esm/pagination/props
- tdesign-vue-next/esm/pagination/props.js
- tdesign-vue-next/esm/pagination/style
- tdesign-vue-next/esm/pagination/style/index.js
- tdesign-vue-next/esm/pagination/useMoreAction
- tdesign-vue-next/esm/pagination/useMoreAction.js
- tdesign-vue-next/esm/pagination/usePaginationClasses
- tdesign-vue-next/esm/pagination/usePaginationClasses.js
- tdesign-vue-next/esm/popconfirm
- tdesign-vue-next/esm/popconfirm/index.js
- tdesign-vue-next/esm/popup
- tdesign-vue-next/esm/popup/index.js
- tdesign-vue-next/esm/progress
- tdesign-vue-next/esm/progress/index.js
- tdesign-vue-next/esm/radio
- tdesign-vue-next/esm/radio/index.js
- tdesign-vue-next/esm/range-input
- tdesign-vue-next/esm/range-input/index.js
- tdesign-vue-next/esm/rate
- tdesign-vue-next/esm/rate/index.js
- tdesign-vue-next/esm/select
- tdesign-vue-next/esm/select-input
- tdesign-vue-next/esm/select-input/index.js
- tdesign-vue-next/esm/select/index.js
- tdesign-vue-next/esm/skeleton
- tdesign-vue-next/esm/skeleton/index.js
- tdesign-vue-next/esm/slider
- tdesign-vue-next/esm/slider/index.js
- tdesign-vue-next/esm/space
- tdesign-vue-next/esm/space/index.js
- tdesign-vue-next/esm/steps
- tdesign-vue-next/esm/steps/index.js
- tdesign-vue-next/esm/swiper
- tdesign-vue-next/esm/swiper/index.js
- tdesign-vue-next/esm/switch
- tdesign-vue-next/esm/switch/index.js
- tdesign-vue-next/esm/table
- tdesign-vue-next/esm/table/index.js
- tdesign-vue-next/esm/tabs
- tdesign-vue-next/esm/tabs/index.js
- tdesign-vue-next/esm/tag
- tdesign-vue-next/esm/tag-input
- tdesign-vue-next/esm/tag-input/index.js
- tdesign-vue-next/esm/tag/index.js
- tdesign-vue-next/esm/textarea
- tdesign-vue-next/esm/textarea/index.js
- tdesign-vue-next/esm/time-picker
- tdesign-vue-next/esm/time-picker/index.js
- tdesign-vue-next/esm/tooltip
- tdesign-vue-next/esm/tooltip/index.js
- tdesign-vue-next/esm/transfer
- tdesign-vue-next/esm/transfer/index.js
- tdesign-vue-next/esm/tree
- tdesign-vue-next/esm/tree-select
- tdesign-vue-next/esm/tree-select/index.js
- tdesign-vue-next/esm/tree/index.js
- tdesign-vue-next/esm/upload
- tdesign-vue-next/esm/upload/index.js
- tdesign-vue-next/esm/utils/withInstall.js
- tdesign-vue-next/esm/watermark
- tdesign-vue-next/esm/watermark/index.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (tdesign-vue-next) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
TDesign 适配桌面端的组件库,适合在 vue 3.x 技术栈项目中使用。
🎉 特性
- 适配桌面端交互
- 基于 Vue3
- 与其他框架(Vue/React/Angular)版本 API、UI 保持一致
- 支持暗黑模式及其他主题定制
- 支持按需加载
安装
npm i tdesign-vue-next
基础使用
推荐使用 Webpack 或 Rollup 等支持 tree-shaking 特性的构建工具,无需额外配置即可实现组件按需引入:
import { createApp } from 'vue';
import { Button } from 'tdesign-vue-next';
// 引入组件库全局样式资源
import 'tdesign-vue-next/es/style/index.css';
import App from './app.vue';
const app = createApp(App);
app.use(Button);
npm package 中提供了多种构建产物,可以阅读 这里 了解不同目录下产物的差别。
快速体验
可以访问官方提供的 tdesign-starter 项目体验使用 TDesign 组件快速搭建业务系统。
浏览器兼容性
![]() |
![]() |
![]() |
![]() |
---|---|---|---|
Edge >=84 | Firefox >=83 | Chrome >=84 | Safari >=14.1 |
详情参见桌面端组件库浏览器兼容性说明
其他技术栈实现
开源协议
TDesign 遵循 MIT 协议。