TK-Temp-CLI 多模板脚手架

简介

TK-Temp-CLI 是一个多模板前端脚手架工具，提供多种现代化前端开发模板，帮助开发者快速启动项目。

当前支持的模板

1. Vue3 + TypeScript + TailwindCSS - 现代Web应用开发模板
2. UniApp Vue3 + TS + TailwindCSS + ColorUI - 跨平台小程序/移动端开发模板
3. UniApp X - 下一代UniApp开发模板

安装

全局安装脚手架工具：

npm install tk-temp-cli -g
# 或者使用yarn
yarn global add tk-temp-cli
# 或者使用pnpm
pnpm add -g tk-temp-cli

使用指南

创建新项目

npx tk-temp-cli create <project-name>

执行命令后，按提示选择需要的模板：

1. Vue3 + TypeScript + TailwindCSS
2. UniApp Vue3 + TS + TailwindCSS + ColorUI

示例

npx tk-temp-cli create my-project

模板详情

1. Vue3 + TypeScript + TailwindCSS 模板

技术栈：

• Vue 3 (Composition API)
• TypeScript
• TailwindCSS
• Vite
• Pinia (状态管理)
• Vue Router

特点：

• 现代化的Web应用开发配置
• 完整的TypeScript支持
• TailwindCSS实用工具类集成
• 预配置的ESLint + Prettier

2. UniApp Vue3 + TS + TailwindCSS + ColorUI 模板

技术栈：

• UniApp (Vue3版本)
• TypeScript
• TailwindCSS
• ColorUI
• Pinia (状态管理)

特点：

• 一套代码多端发布
• 同时支持TailwindCSS和ColorUI
• 小程序/移动端优化配置
• 常用UniApp组件示例

项目结构（以UniApp模板为例）

├── src
│   ├── components            # 公共组件
│   ├── pages                 # 页面目录
│   ├── static                # 静态资源
│   ├── store                 # Pinia状态管理
│   ├── styles                # 全局样式
│   │   ├── tailwind.css      # Tailwind入口文件
│   │   └── colorui          # ColorUI样式文件
│   ├── utils                 # 工具函数
│   ├── App.vue               # 应用入口
│   └── main.ts               # 主入口文件
├── tailwind.config.js        # Tailwind配置
├── vite.config.ts            # Vite配置
└── package.json

开发命令

所有模板都提供以下基本命令（具体可能因模板而异）：

# 安装依赖
npm install

# 开发模式
npm run dev

# 生产构建
npm run build

# 代码格式检查
npm run lint

注意事项

1. 使用UniApp模板需要安装HBuilderX或相关开发工具
2. 不同平台的小程序可能需要额外配置
3. 首次使用TailwindCSS可能需要等待IDE插件安装完成以获得最佳体验

更新日志

• 1.0.0 初始版本发布，包含三个基础模板

反馈与贡献

欢迎通过Issue提交问题或建议，也欢迎提交Pull Request参与改进。

许可证

MIT License