mirror of
https://github.com/Tencent/tdesign-vue-next-starter.git
synced 2024-12-22 21:26:33 +08:00
A starter-kit for TDesign Vue Next UI components
266d032520
* fix: echarts resize error * chore: remove useless code * feat: update icon * feat: compress bg img * docs: readme update |
||
---|---|---|
.github | ||
.husky | ||
.vscode | ||
docker | ||
docs | ||
public | ||
src | ||
.editorconfig | ||
.env | ||
.env.development | ||
.eslintignore | ||
.eslintrc | ||
.gitignore | ||
.prettierrc.js | ||
.stylelintignore | ||
cache.dockerfile | ||
commitlint.config.js | ||
globals.d.ts | ||
index.html | ||
LICENSE | ||
package.json | ||
README.md | ||
stylelint.config.js | ||
tsconfig.json | ||
vite.config.ts |
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
<t-layout>
<t-header>
<t-footer>
<t-aside>
<t-content>
提交规范
整齐美观的提交规范,沟通维护更加省力 Angular Git Commit Guidelines
兼容性
IE / Edge |
Firefox |
Chrome |
Safari |
---|---|---|---|
Edge >=16 | Firefox >=60 | Chrome >=61 | Safari >=11 |