agentCLAWHUBUnverified
Fe Cli
前端项目脚手架 CLI。支持 React/Vue/Next.js/Nuxt.js/Astro/React Native + shadcn/Ant Design/MUI/Tailwind + Zustand/Redux + i18n，初始化标准化前端项目。支持 9 种项目类型：Web SPA、后台管理、移动 H5、... Skill: Fe Cli Owner: z-zihan Summary: 前端项目脚手架 CLI。支持 React/Vue/Next.js/Nuxt.js/Astro/React Native + shadcn/Ant Design/MUI/Tailwind + Zustand/Redux + i18n，初始化标准化前端项目。支持 9 种项目类型：Web SPA、后台管理、移动 H5、... Tags: latest:3.1.1 Version history: v3.1.1 | 2026-05-23T19:27:39.296Z | user Auto-publish from commit 265fd1e38f8cebfbc499cb8d2ae54f2fce9cf2e4 v3.1.0 | 2026-05-23T19:12:37.955Z | user Auto-publish from commit deb04d5ca6ff
OpenClaw
Rank
62
Safety
84
Downloads
1.6k
Updated
Oct 10, 2026
Version
3.1.1
Source
CLAWHUB
About
What it does, and when to use it.
Capability contract not published. No trust telemetry is available yet. 1.6K downloads reported by the source. Last updated 10/10/2026.
Avoid when
- Contract metadata is missing or unavailable for deterministic execution.
Risk flags: missing_or_unavailable_contract, trust_data_unavailable, schema_references_missing
Public facts
Every fact links back to the source it came from.
- Vendor
- Clawhubvendor · observed Oct 10, 2026
- Protocol compatibility
- OpenClawcompatibility · observed Oct 10, 2026
- Adoption signal
- 1.6K downloadsadoption · observed Oct 10, 2026
- Latest release
- 3.1.1release · observed May 23, 2026
- Handshake status
- UNKNOWNsecurity
Install and run
Setup complexity: low.
clawhub skill install s17bsrqjkb5zv8sm90kdv3zawn83g42h:fe-cli- Setup complexity is classified as HIGH. You must provision dedicated cloud infrastructure or an isolated VM. Do not run this directly on your local workstation.
- Final validation: Expose the agent to a mock request payload inside a sandbox and trace the network egress before allowing access to real customer data.
Contract: missing
curl -s "https://www.xpersona.co/api/v1/agents/clawhub-z-zihan-fe-cli/snapshot"
Documentation
CLAWHUB
147,036 characters of source documentation, loaded on request.
Extracted files
5 files captured from the source.
admin/SKILL.md
--- name: fe-cli-admin description: > Scaffold an Admin Dashboard frontend project. For data management backends, CRUD systems, and internal tools. Features permission-based routing, login page, Ant Design Pro layout. Triggered as a sub-skill of fe-cli when user wants an admin/后台管理 project type. --- # fe-cli-admin — Admin Dashboard Scaffolding ## Workflow ### Step 1: Gather Options Skip questions already answered in user's request. 1. **Framework**: React 19 / Vue 3 (React recommended for admin, Ant Design is React-only; Vue admin 推荐 Element Plus) 2. **Styling/UI**: Ant Design (default React) / shadcn/ui + Lucide (React) / Element Plus (default Vue) / shadcn-vue + Vue Bits (Vue) / Tailwind CSS / MUI 3. **CSS Preprocessor**: Sass / Less (default: Sass) 4. **State Management**: Zustand / Redux Toolkit / Pinia (Vue) / None 5. **Charts**: Recharts (lightweight) / ECharts (heavy) / None 6. **i18n**: react-i18next / vue-i18n / None 7. **Testing**: Vitest / None 8. **Pre-commit hooks**: husky + lint-staged + commitlint? (default: No) 9. **Project name**: string (required) ### Step 2: Scaffold Project ``` bun create vite <project-name> --template react-ts ``` For Vue: `bun create vite <project-name> --template vue-ts` (Use `pnpm create vite` if bun unavailable) ### Step 3: Install Dependencies **React (Ant Design):** ``` bun add antd @ant-design/icons @ant-design/v5-patch-for-react-19 react-router-dom dayjs ``` **React (shadcn/ui):** ``` bun add react-router-dom dayjs lucide-react && npx shadcn@latest init ``` **Vue (Element Plus):** ``` bun add element-plus @element-plus/icons-vue vue-router dayjs ``` **Vue (shadcn-vue):** ``` bun add vue-router dayjs lucide-vue-next && npx shadcn-vue@latest init ``` Plus extras based on selections (zustand, pinia, i18n, charts, etc.) **Charts:** - Recharts: `bun add recharts` - ECharts: `bun add echarts echarts-for-react` (React) / `bun add echarts vue-echarts` (Vue) For date handling: `pnpm add dayjs` (recommended; moment is deprecated and not recommended). ### Step 4: Generate Admin-Specific Files ``` src/ ├── components/ # Global components (from shared infrastructure) │ ├── AppProvider.tsx │ ├── AuthGuard.tsx │ ├── GlobalLoading.tsx │ ├── ErrorBoundary.tsx │ ├── PageLoading.tsx │ ├── EmptyState.tsx │ └── ErrorState.tsx ├── layouts/ │ └── AdminLayout.tsx # Sidebar + Header + Content layout (admin-specific) ├── pages/ │ ├── Login/ │ │ └── index.tsx # Login page with form │ ├── Dashboard/ │ │ └── index.tsx # Dashboard with stats cards │ ├── List/ │ │ └── index.tsx # Table list page template │ ├── Form/ │ │ └── index.tsx # Form page template │ └── NotFound.tsx ├── store/ # State management (from shared infrastructure) │ └── useUserStore.ts # Auth state (token, user info, login/logout) ├── config/ │ └── routes.tsx # Route config with permission g
astro/SKILL.md
--- name: fe-cli-astro description: > Scaffold a static site / content site project. Supports Astro, Gatsby (React), and VitePress (Vue). For blogs, documentation sites, portfolios, landing pages with SSG/SSR. Triggered as a sub-skill of fe-cli when user wants Astro/Gatsby/建站/博客/文档站/VitePress project. --- # fe-cli-astro — Static Site Scaffolding ## Workflow ### Step 1: Gather Options 1. **Framework**: Astro / Gatsby (React) / VitePress (Vue) 2. **UI Integration** (Astro only): React / Vue / Svelte / Preact / None (Astro components only) 3. **Styling**: Tailwind CSS / shadcn/ui (Astro+React) / 纯 SCSS 4. **Content**: MDX (Astro/Gatsby) / Markdown (all) / CMS integration (Contentful/Sanity) / None 5. **i18n**: Yes / No 6. **Deployment**: Vercel (default) / Netlify / Cloudflare Pages 7. **Project name**: string **Quick guide:** - **Blog / portfolio / content site** → Astro (islands architecture, partial hydration, fast) - **React-heavy content site** → Gatsby (GraphQL data layer, rich plugin ecosystem) - **Vue documentation site** → VitePress (Vue-powered static site, markdown-first) ### Step 2: Scaffold **Astro:** ``` bun create astro@latest <project-name> ``` Interactive prompt: template (blog/docs/portfolio/empty), TypeScript, install dependencies. Or with flags: ``` bunx create-astro <project-name> --template blog --typescript strict --install ``` **Gatsby:** ``` bunx gatsby new <project-name> ``` **VitePress:** ``` mkdir <project-name> && cd <project-name> bun init bun add -D vitepress vue mkdir docs && echo '# Hello VitePress' > docs/index.md ``` ### Step 3: Install Additional Dependencies | Selection | Packages | |---|---| | **Astro** | | | Tailwind CSS | `@astrojs/tailwind tailwindcss` (Astro 4+) or `tailwindcss @tailwindcss/vite` | | React integration | `@astrojs/react react react-dom` | | Vue integration | `@astrojs/vue vue` | | MDX | `@astrojs/mdx` | | i18n | `astro-i18next` / manual routing | | shadcn/ui | `npx shadcn@latest init` (if React integration) + `lucide-react` | | **Gatsby** | | | Tailwind CSS | `tailwindcss postcss autoprefixer` + `gatsby-plugin-postcss` | | MDX | `gatsby-plugin-mdx @mdx-js/react` | | CMS | `gatsby-source-contentful` / `gatsby-source-sanity` | | **VitePress** | | | Tailwind CSS | `tailwindcss @tailwindcss/vite` | | Vue components | `vue` (already included) | | Search | `vitepress-plugin-search` / Algolia | ### Step 4: Project Structure **Astro:** ``` project-name/ ├── src/ │ ├── components/ │ │ ├── BaseHead.astro # <head> meta tags, fonts, styles │ │ ├── Header.astro # Navigation header │ │ ├── Footer.astro # Site footer │ │ └── Card.astro # Content card component │ ├── content/ │ │ ├── config.ts # Content collection schema │ │ └── blog/ # Blog posts (MDX/Markdown) │ │ └── first-post.mdx │ ├── layouts/ │ │ ├── BaseLayout.astro # Page layout wrapper │ │ └── BlogPost.astro # Blog p
electron/SKILL.md
---
name: fe-cli-electron
description: >
Scaffold an Electron desktop application. For macOS/Windows desktop apps using React/Vue.
Features auto-update (electron-updater), IPC communication, system tray, native menus.
For lighter desktop apps, consider Tauri (fe-cli-tauri) instead.
Triggered as a sub-skill of fe-cli when user wants Electron/桌面端 project.
---
# fe-cli-electron — Electron Desktop App Scaffolding
## Workflow
### Step 1: Gather Options
1. **Framework**: React 19 / Vue 3
2. **Styling**: Tailwind CSS / Ant Design / MUI / 纯 SCSS
3. **CSS Preprocessor**: Sass / Less
4. **State Management**: Zustand / Redux Toolkit / None
5. **Router**: React Router / Vue Router
6. **i18n**: Yes / No
7. **Auto Update**: Yes (default) / No
8. **System Tray**: Yes / No
9. **Testing**: Vitest / None
10. **Pre-commit**: Yes / No
11. **Project name**: string
### Step 2: Scaffold
```
pnpm create vite <project-name> --template react-ts
cd <project-name>
pnpm add -D electron electron-builder concurrently wait-on
pnpm add electron-updater electron-store # if auto-update selected
```
### Step 3: Project Structure
```
project-name/
├── electron/
│ ├── main.ts # Main process entry
│ ├── preload.ts # Preload script (contextBridge)
│ └── updater.ts # Auto-update logic (if selected)
├── src/ # Renderer process (React/Vue)
│ ├── components/ # Global components (from shared infrastructure)
│ ├── pages/ # Page components
│ ├── hooks/ # Common hooks (from shared infrastructure)
│ ├── store/ # State management (from shared infrastructure)
│ ├── theme/ # Theme system (from shared infrastructure)
│ ├── config/ # App constants + routes (from shared infrastructure)
│ ├── services/ # API layer (from shared base)
│ ├── utils/ # Utilities (from shared base)
│ ├── styles/ # Global styles (from shared base)
│ ├── electron.d.ts # IPC type declarations
│ ├── App.tsx
│ └── main.tsx
├── package.json
├── vite.config.ts
├── electron-builder.yml # Build config
└── resources/ # App icons
```
### Step 4: Key Templates
**`electron/main.ts`:**
```typescript
import { app, BrowserWindow, ipcMain, Tray, Menu, nativeImage } from 'electron';
import path from 'path';
import { setupUpdater } from './updater'; // if auto-update
let mainWindow: BrowserWindow | null = null;
let tray: Tray | null = null;
const isDev = !app.isPackaged;
function createWindow() {
mainWindow = new BrowserWindow({
width: 1200,
height: 800,
minWidth: 800,
minHeight: 600,
webPreferences: {
preload: path.join(__dirname, 'preload.js'),
contextIsolation: true,
nodeIntegration: false,
},
titleBarStyle: 'hiddenInset', // macOS native title bar
});
if (isDev) {
mainWindow.loadURL('http://localhost:5173');
mainWindow.wh5/SKILL.md
---
name: fe-cli-h5
description: >
Scaffold a Mobile H5 frontend project. For mobile web pages, WeChat H5 pages,
and mobile-first web apps. Features vw/vh responsive, touch gestures, safe area,
and WeChat JSSDK integration. Triggered as a sub-skill of fe-cli.
---
# fe-cli-h5 — Mobile H5 Scaffolding
## Workflow
### Step 1: Gather Options
1. **Framework**: React 19 / Vue 3
2. **Styling**: Tailwind CSS (default, mobile-first) / Ant Design Mobile / 纯 SCSS
3. **CSS Preprocessor**: Sass (default) / Less
4. **State Management**: Zustand / Redux Toolkit / Pinia / None
5. **Router**: React Router / Vue Router
6. **i18n**: react-i18next / vue-i18n / None
7. **WeChat JSSDK**: Yes / No (if yes, add `weixin-js-sdk`)
8. **Testing**: Vitest / None
9. **Pre-commit**: husky + lint-staged? (default: No)
10. **Project name**: string
### Step 2: Scaffold
```
pnpm create vite <project-name> --template react-ts
```
### Step 3: Dependencies
```
pnpm add react-router-dom
pnpm add -D postcss-px-to-viewport-8-plugin amfe-flexible
pnpm add -D sass
```
If WeChat JSSDK: `pnpm add weixin-js-sdk`
If Vue: replace react-router-dom with vue-router
### Step 4: H5-Specific Configuration
**`postcss.config.cjs`:**
```javascript
module.exports = {
plugins: {
'postcss-px-to-viewport-8-plugin': {
viewportWidth: 375, // Design width
unitPrecision: 5,
viewportUnit: 'vw',
selectorBlackList: ['.ignore-vw'],
minPixelValue: 1,
mediaQuery: false,
},
},
};
```
**`vite.config.ts`** — add mobile-specific config:
```typescript
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import path from 'path';
export default defineConfig(({ mode }) => ({
plugins: [react()],
resolve: { alias: { '@': path.resolve(__dirname, 'src') } },
css: {
postcss: './postcss.config.cjs',
preprocessorOptions: {
scss: { additionalData: '@use "@/styles/variables" as *;' },
},
},
server: {
port: 5173,
host: '0.0.0.0', // Allow LAN access for mobile testing
proxy: { '/api': { target: 'http://localhost:3000', changeOrigin: true } },
},
}));
```
**`index.html`** — add viewport meta:
```html
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
```
### Step 5: H5-Specific Files
```
src/
├── components/
│ ├── ErrorBoundary.tsx
│ ├── PageLoading.tsx
│ ├── EmptyState.tsx
│ ├── ErrorState.tsx
│ └── SafeArea.tsx # Safe area padding for notch phones
├── pages/
│ ├── Home/
│ │ └── index.tsx
│ ├── Detail/
│ │ └── index.tsx
│ └── Mine/
│ └── index.tsx
├── layouts/
│ └── MobileLayout.tsx # Bottom tab bar
├── hooks/ # Common hooks (generated by shared layer)
│ ├── useRequest.ts # Data fetching (generated by shared layer)
│ └── useWechat.ts # WeChat JSSDK hook (if selected)
├── store/ # State management (generatedminiapp/SKILL.md
---
name: fe-cli-miniapp
description: >
Scaffold a WeChat Mini Program project using Taro or uni-app framework.
Features subpackage configuration, native API wrappers, subscription messages,
and multi-platform build (WeChat, Alipay, etc.). Triggered as a sub-skill of fe-cli
when user wants 小程序/微信小程序/Mini Program project.
---
# fe-cli-miniapp — Mini Program Scaffolding
## Workflow
### Step 1: Gather Options
1. **Framework**: Taro (React) / Taro (Vue) / uni-app (Vue)
2. **Styling**: Tailwind (via weapp-tailwindcss) / SCSS / Less
3. **CSS Preprocessor**: Sass / Less
4. **State Management**: Zustand / Redux Toolkit / Pinia (Vue) / None
5. **i18n**: Yes (Taro: @tarojs/plugin-i18n) / No
6. **Subpackages**: Yes (分包) / No
7. **Target Platforms**: 微信 / 支付宝 / 字节 / 百度 / 全部
8. **Testing**: Vitest / None
9. **Pre-commit**: Yes / No
10. **Project name**: string
### Step 2: Scaffold
**Taro (React):**
```
pnpm create @tarojs/app <project-name> --template react-ts --css sass --compiler vite
```
**Taro (Vue):**
```
pnpm create @tarojs/app <project-name> --template vue3-ts --css sass --compiler vite
```
**uni-app:**
```
pnpm create uni-app <project-name> --template vue3-ts
```
### Step 3: Dependencies
| Need | Packages |
|---|---|
| Zustand | `zustand` |
| Redux | `@reduxjs/toolkit react-redux` |
| Pinia (uni-app) | Pinia comes with uni-app template |
| Taro i18n | `@tarojs/plugin-i18n` |
| Tailwind | `weapp-tailwindcss` (Taro plugin) |
| Icons | `@taroify/icons` (icon components for Taro) |
### Step 4: Project Structure (Taro)
```
src/
├── pages/
│ ├── index/
│ │ ├── index.tsx # Home page
│ │ ├── index.config.ts # Page config (title, etc.)
│ │ └── index.scss
│ ├── detail/
│ │ └── ...
│ └── mine/
│ └── ...
├── components/
│ ├── NavBar.tsx # Custom navigation bar
│ ├── EmptyState.tsx
│ ├── ErrorState.tsx
│ └── PageLoading.tsx
├── services/
│ ├── request.ts # Taro.request wrapper
│ └── api/
│ └── index.ts
├── utils/
│ ├── index.ts # General utils
│ ├── storage.ts # Taro Storage wrapper
│ ├── format.ts
│ └── validate.ts
├── hooks/
│ └── useRequest.ts
├── stores/ # State management
├── styles/
│ └── variables.scss
├── app.config.ts # Global app config (pages, window, subpackages)
├── app.tsx # App entry
└── app.scss # Global styles
```
### Step 5: Subpackage Config (if selected)
In `app.config.ts`:
```typescript
export default defineAppConfig({
pages: ['pages/index/index', 'pages/mine/mine'],
subPackages: [
{
root: 'packageA',
name: 'packageA',
pages: ['pages/detail/detail', 'pages/list/list'],
},
{
root: 'packageB',
name: 'packageB',
pages: ['pages/settings/settings'],
},
],
window: {
backgroundTextStyle: 'light',
navigationBarBackgroundColor: '#fff',
navigationBarTitleText: 'WeChat',
navGithub ReposUpdated 15h agoRank 70
AionUi
Free, local, open-source 24/7 Cowork app and OpenClaw for Gemini CLI, Claude Code, Codex, OpenCode, Qwen Code, Goose CLI, Auggie, and more | 🌟 Star if you like it!
MCPOPENCLAW
Github ReposUpdated 6mo agoRank 70
activepieces
AI Agents & MCPs & AI Workflow Automation • (~400 MCP servers for AI agents) • AI Automation / AI Agent with MCPs • AI Workflows & AI Agents • MCPs for AI Agents
OPENCLAW
Github ReposUpdated 6mo agoRank 70
cherry-studio
AI productivity studio with smart chat, autonomous agents, and 300+ assistants.
MCPOPENCLAW
Github ReposUpdated 7mo agoRank 70
CopilotKit
The Frontend for Agents & Generative UI. React + Angular
OPENCLAW
Machine-readable data
The same record, as JSON, for agents and crawlers.
{
"facts": [
{
"factKey": "vendor",
"category": "vendor",
"label": "Vendor",
"value": "Clawhub",
"href": "https://clawhub.ai/z-zihan/skills/fe-cli",
"sourceUrl": "https://clawhub.ai/z-zihan/skills/fe-cli",
"sourceType": "profile",
"confidence": "medium",
"observedAt": "2026-10-10T08:12:40.692Z",
"isPublic": true
},
{
"factKey": "protocols",
"category": "compatibility",
"label": "Protocol compatibility",
"value": "OpenClaw",
"href": "https://www.xpersona.co/api/v1/agents/clawhub-z-zihan-fe-cli/contract",
"sourceUrl": "https://www.xpersona.co/api/v1/agents/clawhub-z-zihan-fe-cli/contract",
"sourceType": "contract",
"confidence": "medium",
"observedAt": "2026-10-10T08:12:40.692Z",
"isPublic": true
},
{
"factKey": "traction",
"category": "adoption",
"label": "Adoption signal",
"value": "1.6K downloads",
"href": "https://clawhub.ai/z-zihan/fe-cli",
"sourceUrl": "https://clawhub.ai/z-zihan/fe-cli",
"sourceType": "profile",
"confidence": "medium",
"observedAt": "2026-10-10T08:12:40.692Z",
"isPublic": true
},
{
"factKey": "latest_release",
"category": "release",
"label": "Latest release",
"value": "3.1.1",
"href": "https://clawhub.ai/z-zihan/fe-cli",
"sourceUrl": "https://clawhub.ai/z-zihan/fe-cli",
"sourceType": "release",
"confidence": "medium",
"observedAt": "2026-05-23T19:27:39.296Z",
"isPublic": true
},
{
"factKey": "handshake_status",
"category": "security",
"label": "Handshake status",
"value": "UNKNOWN",
"href": "https://www.xpersona.co/api/v1/agents/clawhub-z-zihan-fe-cli/trust",
"sourceUrl": "https://www.xpersona.co/api/v1/agents/clawhub-z-zihan-fe-cli/trust",
"sourceType": "trust",
"confidence": "medium",
"observedAt": null,
"isPublic": true
}
],
"events": [
{
"eventType": "release",
"title": "Release 3.1.1",
"description": "Auto-publish from commit 265fd1e38f8cebfbc499cb8d2ae54f2fce9cf2e4",
"href": "https://clawhub.ai/z-zihan/fe-cli",
"sourceUrl": "https://clawhub.ai/z-zihan/fe-cli",
"sourceType": "release",
"confidence": "medium",
"observedAt": "2026-05-23T19:27:39.296Z",
"isPublic": true
}
]
}Record generated Oct 10, 2026.