[![](https://tdesign.gtimg.com/starter/brand-logo.svg)](http://tdesgin.tencent.com/starter/vue/#/dashboard/base)

# TDesign Starter ## 项目简介 TDesign Starter 基于 TDesign UI 组件，旨在提供项目开箱即用的、配置式的并且拥有开发体验和设计感的中后台的项目。 - 设计美观 - 基于 TDesign UI 设计规范 - 提供 Figma、 Sketch、 Adobe XD、 Axure等多种类型的设计资源 - 在开源体系上打造具有自身品牌特色且好用的产品
- 完备路由 - 同时支持配置式路由和自定义路由 - 对于配置型路由，提供导航类组件的深度定制（“菜单 Menu”、“面包屑 Breadcrumb”），无需手动处理路由映射关系。
- 动态布局: - 内置“左右布局”、“上左右布局”、“上下布局”等中后台常用布局， - 页面内容基于 24 栅格布局设计，内置“常规型”和“紧凑型”两种间距模式
- 极速HRM: - 采用 `Vite` 构建 - 开发环境下体验浏览器 esmodule bundless, 达到极速更新，无需等待漫长的 bundle 过程
- 开发规范: - 统一规范会减少沟通成本，提高开发和维护的体验； - 提交规范采用 `Angular commit 规范` - 同时推荐采用 `vscode` 开发
## 项目脚本 ``` // 安装依赖 npm install // 启动项目 npm run dev // 项目构建 - 体验环境 npm run build:test // 项目构建 npm run build // 项目预览 npm run preview // 项目 eslint npm run lint // 修复 eslint npm run lint:fix // 项目 stylelint npm run stylelint // 修复 stylelint npm run stylelint:fix ```
## 布局网站布局支持“空布局”， “侧边栏导航布局”， “侧边栏布局加头部导航”，“头部导航”四种；布局文件地址在src/layouts 更多定制化布局，推荐使用 TDesign UI layout - `````` - `````` - `````` - `````` - ``````
## 提交规范整齐美观的提交规范，沟通维护更加省力 [Angular Git Commit Guidelines](https://zj-git-guide.readthedocs.io/zh_CN/latest/message/Angular%E6%8F%90%E4%BA%A4%E4%BF%A1%E6%81%AF%E8%A7%84%E8%8C%83/)
## 兼容性 | [

](http://godban.github.io/browsers-support-badges/)
IE / Edge | [

](http://godban.github.io/browsers-support-badges/)
Firefox | [

](http://godban.github.io/browsers-support-badges/)
Chrome | [

](http://godban.github.io/browsers-support-badges/)
Safari | | --------- | --------- | --------- | --------- | | Edge >=16 | Firefox >=60| Chrome >=61| Safari >=11