1.0.0-rc.0 • Published 3 months ago

genauth-cli v1.0.0-rc.0

Weekly downloads
-
License
ISC
Repository
-
Last release
3 months ago

GenAuth CLI 使用说明

GenAuth CLI 是一个命令行工具,用于快速创建和管理基于 GenAuth Guard 的项目。它支持 React 和 Vue3 框架,可以帮助开发者快速搭建带有认证功能的应用。

特性

  • 🚀 快速创建项目,自动配置开发环境
  • 🎨 支持 React/Vue3/Angular 等主流前端框架
  • 🔒 内置 GenAuth Guard 认证方案
  • 🎯 支持嵌套 Guard 登录组件和纯自定义登录页面两种模式
  • 🛠️ 集成主流 UI 框架(Ant Design/Element Plus)
  • 🤖 内置 AI 助手,通过自然语言交互式地为用户生成 GenAI 应用的登录页面

安装

npm install genauth-cli -g

快速开始

  1. 创建新项目:
genauth-cli init
  1. 进入项目目录:
cd your-project-name
  1. 启动开发服务器:
npm run dev

详细命令

1. 初始化项目 (init)

创建一个新的 GenAuth Guard 项目。

genauth-cli init

交互式配置选项:

  • 项目名称(默认:my-project)
  • 框架选择
    • React(支持 React 18)
    • Vue3(支持 Vue 3.x)
  • 开发模式
    • GenAuth Guard(由 GenAuth 提供的可嵌入登录组件)
    • Custom Login Page(自定义登录页面)
  • UI 框架(仅当选择 Custom Login Page 时可用)
    • Ant Design:React 生态的企业级 UI 框架
    • Element Plus:Vue3 生态的企业级 UI 框架

执行后会:

  1. 创建项目目录
  2. 复制对应模板文件
  3. 配置 package.json
  4. 安装依赖
  5. 保存项目配置

2. 构建指南 (build)

显示项目迁移指南,帮助开发者集成 GenAuth Guard。

genauth-cli build

根据项目类型显示不同的迁移步骤:

React + GenAuth Guard:

  1. 安装 @genauth/guard-react18
  2. 使用 GuardProvider 包装 App 组件
  3. 复制登录页面代码

Vue3 + GenAuth Guard:

  1. 安装 @genauth/guard-vue3
  2. 添加 createGuard 到 Vue 应用
  3. 复制登录页面代码

React/Vue3 + Custom Login Page:

  1. 安装对应的 Guard 包
  2. 复制登录页面代码

3. AI 助手 (magic)

提供 AI 辅助功能,帮助解决开发过程中的问题(目前处于开发阶段)。

genauth-cli magic

项目结构

初始化后的项目结构会根据选择的框架和类型有所不同:

my-project/
├── src/
│ ├── components/
│ │ └── Login.(tsx|vue) # 登录组件
│ ├── App.(tsx|vue) # 主应用
│ └── main.(tsx|ts) # 入口文件
├── package.json
└── ...配置文件