vue2.6及以下版本导入 TDesign UI组件库

TDesign 官方文档:https://tdesign.tencent.com/vue/components/button

我们先打开一个普通的vue项目

然后 如果你是 vue 2.6 或者 低于 2.6 在终端执行

javascript 复制代码
npm i tdesign-vue

如果你是 2.7 或者更高 执行

javascript 复制代码
npm i tdesign-vue@naruto

这里 我们 以 2.6为例

因为大部分人 用vue2 都是选择 2.6

先引入一下依赖

然后 我们打开程序入口文件main.js

在里面加上下面这些代码

javascript 复制代码
import Tdesign from 'tdesign-vue'
import 'tdesign-vue/es/style/index.css';
Vue.use(Tdesign)

这样就OK 了 我们来试着用一下它的组件

例如 我们这里复制个按钮的代码

然后 我们启动项目

我们的按钮就出来了

相关推荐
玖玥拾20 小时前
C# 语言进阶(十四)Unity UI界面开发 + 网络消息联动
服务器·开发语言·网络·ui·unity·c#·游戏引擎
不羁的木木1 天前
HarmonyOS APP实战-画图APP - 第6篇:形状切换与UI优化
ui·华为·harmonyos
anling_li1 天前
《图片华容道》三、HarmonyOS_ArkTS开发调试实战_崩溃修复全记录
ui·华为·harmonyos
anling_li1 天前
《随机乱序键盘》四、简约风格随机乱序键盘案例指南
ui·华为·harmonyos
星释2 天前
鸿蒙智能体开发实战:27.Skill 测试、发布与管理
ui·华为·log4j·harmonyos·鸿蒙·智能体
anling_li2 天前
《图片华容道》一、背景设置使用指南
ui·华为·harmonyos
在书中成长2 天前
HarmonyOS 小游戏《对战五子棋》开发第34篇 - ArkTS中复用UI的方法
ui·harmonyos
爸爸6192 天前
鸿蒙实战:@State 本地状态与 UI 刷新
ui·华为·harmonyos·鸿蒙系统
酷酷的身影2 天前
Managers/APConfigManager.cs
开发语言·ui·c#
星释2 天前
鸿蒙智能体开发实战:22.真机测试
ui·华为·harmonyos·鸿蒙·智能体