create-wlyd

一个简单高效的 Vue3 项目脚手架工具，专注于自动生成模板，让开发者快速搭建项目。

✨ 特性

• 🚀 快速创建 Vue3 项目
• 📦 多种项目模板可选（Vue3 基础、后台管理、H5、Nuxt3）
• 🎨 自动生成 Vue 组件
• 💻 智能目录结构管理
• 🔧 支持命令行交互式配置
• 📱 跨平台兼容（Windows/macOS/Linux）
• 🔄 自动安装依赖并初始化 Git 仓库
• 📂 自动打开项目文件夹

🚀 快速开始

创建项目

pnpm create wlyd my-project

运行命令后，会出现交互式界面供您选择项目模板：

1. Vue3 基础模板 - Vue3 基础项目模板
2. Vue3 后台管理系统模板 - Vue3 后台管理系统模板
3. H5 开发模板 - Vue3 H5 移动端开发模板
4. Nuxt3 模板 - Nuxt3 服务端渲染模板

📋 命令详解

pnpm create wlyd <project-name>

创建新项目

参数：

• project-name - 项目名称（必填）

示例：

pnpm create wlyd my-vue-app

🛠️ 功能详情

项目创建流程

1. 选择项目模板 - 通过交互式界面选择适合的模板
2. 自动克隆远程模板仓库 - 从阿里云 CodeUp 仓库克隆模板
3. 自动安装项目依赖 - 使用 pnpm 安装所有依赖包
4. 初始化 Git 仓库 - 删除原模板的 Git 历史，重新初始化
5. 自动打开项目文件夹 - 在文件管理器中打开项目目录

组件生成特性

• 自动将驼峰命名转换为 kebab-case 文件名
• 生成标准的 Vue3 Composition API 组件结构
• 支持指定目录和独立文件夹模式
• 自动创建不存在的目录

📁 项目结构

生成的 Vue 组件模板包含：

<template>
  <div class="component-name">
    <h2>ComponentName: {{ message }}</h2>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const message = ref('哈哈哈')
</script>

<style>
.component-name {
  color: red;
}
</style>

🌟 模板库

当前支持的项目模板：

| 模板类型 | 描述 | 适用场景 | |---------|------|----------| | Vue3 基础模板 | 纯净的 Vue3 项目 | 基础项目开发 | | Vue3 后台管理系统模板 | 企业后台管理系统模板 | 管理后台、企业应用 | | H5 开发模板 | Vue3 H5 移动端开发模板 | 移动端应用、H5 页面 | | Nuxt3 模板 | Nuxt3 服务端渲染模板 | SEO 友好网站、服务端渲染应用 |

🔧 技术栈

• Node.js >= 18
• pnpm >= 8
• TypeScript 5.9+
• Vue 3 + Composition API
• Vite 7.0+
• UnoCSS 原子化 CSS
• Pinia 状态管理

📦 依赖管理

项目使用 pnpm 作为包管理器，确保快速安装和依赖管理：

# 安装依赖
pnpm install

# 开发模式
pnpm dev

# 构建项目
pnpm build

# 代码检查
pnpm lint

# 类型检查
pnpm typecheck

🎯 开发规范

• 使用 Vue 3 Composition API
• TypeScript 类型声明完整
• ESLint + Prettier 代码规范
• UnoCSS 原子化样式
• 移动优先的响应式设计

📄 许可证

MIT License © 2024 goodswifter

🤝 贡献

欢迎提交 Issue 和 Pull Request！

开发环境设置

# 克隆仓库
git clone https://codeup.aliyun.com/610b3c9d86508f8da8b08436/fe-npm/create-wlyd.git

# 安装依赖
pnpm install

# 开发模式
pnpm dev

# 构建
pnpm build

📞 联系

• 作者：goodswifter
• 邮箱：[email protected]
• 仓库：https://codeup.aliyun.com/610b3c9d86508f8da8b08436/fe-npm/create-wlyd.git

🔄 更新日志

v1.0.11

• 支持多种项目模板（Vue3 基础、后台管理、H5、Nuxt3）
• 优化项目创建流程
• 改进错误处理和用户体验
• 更新依赖版本