TDesign环境搭建-后台模板的安装和使用-构建web管理端后台系统

TDesign环境搭建-后台模板的安装和使用-构建web管理端后台系统


一、安装Nodejs

下载:nodejs

注意,目前前端代码使用的vue3做为脚手架进行开发,需要强制依赖node版本为16及以上


二、模板安装

2.1 安装脚手架:cli

nodejs安装好之后,打开cmd,先安装脚手架:cli


2.2 通过tdesign提供的模板,创建/配置前端项目


2.3 安装前端项目所需依赖

找到项目的根目录,执行命令(选择一种安装方式):npm i | cnpm i | pnpm i | yarn | yarn install

此处,我选择使用cnpm 的方式来安装前端依赖(需要先安装cnpm)


2.4 启动前端项目


2.5 访问前端项目

通过tdesign提供的模板创建的前端项目中,提供的后端管理系统的基本模块,我们直接在这些基础模块上进行开发即可。

三、基于模板项目,开发一个测试页面

3.1 工程安装好之后,用vs code打开我们的目录


3.2 在现有项目中创建测试页面

在pages目录下新建一个dabing文件夹,里边创建一个index.vue页面文件


3.3 配置页面和菜单的对应关系

在router/modules目录下的user.ts里配置路由:当点击左侧的菜单栏里新添加的目录时,显示页面的内容

四、测试新页面

相关推荐
AlienZHOU7 小时前
AI Coding 时代下,我的技术面试实践分享
前端·后端·面试
Captaincc10 小时前
AI用量v0.1.11更新发布 新增 jusage doctor 诊断指令 托盘展示token 和余额 新增 AutoClaw 支持
前端·后端·vibecoding
计算机魔术师12 小时前
德国Wiki被黑后两周,OpenAI终于把模型失控的账本摊开了
前端
kyriewen12 小时前
我让 AI 当面试官面了我一轮:第 3 个追问我就卡住了(附 10 道追问清单)
前端·面试·ai编程
IT_陈寒12 小时前
Python的GIL把我坑惨了,多线程跑得比单线程还慢
前端·人工智能·后端
前端snow13 小时前
ai agent --- 多agent框架之图编排引擎-langgraph
前端
竹林81813 小时前
OmniPic Studio v3.2.1 核心技术架构与全平台发版解析文档
前端·浏览器
JamesZhang8007813 小时前
页面内存只涨不跌? 一次泄漏排查, 牵出 WeakMap 的诞生
前端
Z小明13 小时前
第 6 章 组件进阶
前端·vue.js
江华森13 小时前
HTTP请求的完整过程详解:从DNS解析到TCP挥手的微秒级实战分析
前端