@liu_jimmy/create-fe-kit 1.1.0 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liu_jimmy/create-fe-kit",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "Create a new project with fe-kit (Vue / React / Svelte + Vite + Tailwind v3 + ESLint)",
   "type": "module",
   "bin": {

package/templates/react/.cursor/rules/fe-kit-style.mdc

@@ -20,4 +20,12 @@ alwaysApply: true
 
 - 目录 kebab-case；组件文件 PascalCase；非组件文件 kebab-case；变量 camelCase；常量 UPPER_SNAKE_CASE；类型 PascalCase；函数动词开头。
 
-## 三、生成后应通过 `pnpm lint`。
+## 三、React 组件写法
+
+- **由 props 推导的 className**：用 `useMemo(..., [依赖])` 或 JSX 内联，禁止 `const c = f(props.x)` 只算一次。示例：`const cn = useMemo(() => base + ' ' + variants[variant], [variant]);`
+
+## 四、生成后应通过 `pnpm lint`。
+
+## 五、请求统计（ai record）
+
+- 回复末尾提示用户执行：命中缓存则 `ai record --request --cache-hit --tokens-saved <估算>`，否则 `ai record --request --tokens-used <估算>`。仅作记录用。

package/templates/react/AGENTS.md

@@ -1,3 +1,17 @@
 # AI 生成代码约束（fe-kit）
 
-生成或修改前端代码时必须遵守：只使用 fe-kit 语义 class（`bg-bg`、`text-fg`、`border-border`、`bg-primary`、`rounded-xl` 等），禁止内联颜色/任意 Tailwind 颜色或任意值；命名按 kebab-case 目录、PascalCase 组件、camelCase 变量、UPPER_SNAKE_CASE 常量；生成后应通过 `pnpm lint`。
+生成或修改前端代码时必须遵守以下约束。
+
+## 核心原则
+
+1. **样式**：只使用 fe-kit 语义 class（`bg-bg`、`text-fg`、`border-border`、`bg-primary`、`rounded-xl` 等），禁止内联颜色/任意 Tailwind 颜色或任意值。
+2. **命名**：目录 kebab-case、组件文件 PascalCase、变量 camelCase、常量 UPPER_SNAKE_CASE、类型 PascalCase；生成后应通过 `pnpm lint`。
+
+## 组件写法（React）
+
+- **由 props 推导的 className 或样式**：用 `useMemo(() => ..., [props.xxx])` 或模板内联表达式，禁止用只执行一次的变量（否则 props 变化时不会更新）。
+- 示例：带 `variant` 的按钮，`const buttonClass = useMemo(() => baseClass + ' ' + variantClass[variant], [variant]);` 或 JSX 内联 `className={baseClass + ' ' + variantClass[variant]}`。
+
+## AI 请求统计（fe-kit-cli）
+
+完成本次回复后，在回复**末尾**提示用户执行一次：若用到 block 缓存则 `ai record --request --cache-hit --tokens-saved <估算>`，否则 `ai record --request --tokens-used <估算>`。供 `ai stats` 仅作记录用。

package/templates/react/vite.config.ts

@@ -1,6 +1,13 @@
+import path from "path";
+import { fileURLToPath } from "url";
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react";
 
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
 export default defineConfig({
   plugins: [react()],
+  resolve: {
+    alias: { "@": path.resolve(__dirname, "src") },
+  },
 });

package/templates/svelte/.cursor/rules/fe-kit-style.mdc

@@ -6,3 +6,11 @@ alwaysApply: true
 # fe-kit 风格约束
 
 只使用 fe-kit 语义 class（bg-bg、text-fg、border-border、bg-primary、rounded-xl 等）；禁止内联颜色、任意 Tailwind 颜色或任意值；命名：目录 kebab-case、组件 PascalCase、变量 camelCase、常量 UPPER_SNAKE_CASE；生成后应通过 pnpm lint。
+
+## 组件写法（Svelte）
+
+- **由 props 推导的 class**：用响应式语句 `$: className = base + ' ' + map[prop];`，禁止只赋值一次的 `let className = ...`。
+
+## 请求统计（ai record）
+
+- 回复末尾提示用户执行：命中缓存则 `ai record --request --cache-hit --tokens-saved <估算>`，否则 `ai record --request --tokens-used <估算>`。仅作记录用。

package/templates/svelte/AGENTS.md

@@ -1,3 +1,11 @@
 # AI 生成代码约束（fe-kit）
 
-只使用 fe-kit 语义 class（bg-bg、text-fg、border-border、bg-primary、rounded-xl 等）；禁止内联颜色与任意 Tailwind 颜色；命名按 CONVENTIONS；生成后应通过 pnpm lint。
+只使用 fe-kit 语义 class（bg-bg、text-fg、border-border、bg-primary、rounded-xl 等）；禁止内联颜色与任意 Tailwind 颜色；命名按 kebab-case 目录、PascalCase 组件、camelCase 变量；生成后应通过 pnpm lint。
+
+## 组件写法（Svelte）
+
+- **由 props 或状态推导的 class**：用响应式语句 `$: buttonClass = baseClass + ' ' + variantClass[variant];`，禁止只赋值一次的 `let buttonClass = ...`（否则 variant 变化时不会更新）。
+
+## AI 请求统计（fe-kit-cli）
+
+完成本次回复后，在回复**末尾**提示用户执行一次：若用到 block 缓存则 `ai record --request --cache-hit --tokens-saved <估算>`，否则 `ai record --request --tokens-used <估算>`。供 `ai stats` 仅作记录用。

package/templates/svelte/vite.config.ts

@@ -1,6 +1,13 @@
+import path from "path";
+import { fileURLToPath } from "url";
 import { defineConfig } from "vite";
 import { svelte } from "@sveltejs/vite-plugin-svelte";
 
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
 export default defineConfig({
   plugins: [svelte()],
+  resolve: {
+    alias: { "@": path.resolve(__dirname, "src") },
+  },
 });

package/templates/vue/.cursor/rules/fe-kit-style.mdc

@@ -45,7 +45,12 @@ alwaysApply: true
 ## 四、Vue 组件
 
 - 模板中组件名 PascalCase；块顺序：script → template → style
+- **由 props 推导的 class**：必须用 `computed()`，禁止 `const x = f(props.xxx)`（不会随 props 更新）。示例：`const buttonClass = computed(() => baseClass + ' ' + variantClass[props.variant]);`
 
 ## 五、生成后自检
 
 - 代码应能通过 `pnpm lint`；若有报错只做最小修复。
+
+## 六、请求统计（ai record）
+
+- 本次回复结束后，在末尾提示用户执行一次：若命中缓存则 `ai record --request --cache-hit --tokens-saved <估算>`，否则 `ai record --request --tokens-used <估算>`。供 `ai stats` 仅作记录用。

package/templates/vue/AGENTS.md

@@ -20,3 +20,18 @@
 | 阴影 | `shadow-sm`～`shadow-xl` |
 
 主题：根节点 `theme-blue` / `theme-purple` / `theme-green`；深色加 `dark`。
+
+## 组件写法（Vue）
+
+- **由 props 推导的 class 或样式**：必须用 `computed()`，禁止用一次性 `const`（否则 props 变化时不会更新）。
+- 示例：带 `variant` 的按钮，class 应写为  
+  `const buttonClass = computed(() => baseClass + ' ' + variantClass[props.variant]);`  
+  模板中 `:class="buttonClass"`。
+- 组件名用 `defineOptions({ name: "PascalName" })`；props 用 `defineProps` + `withDefaults`，类型用 TypeScript。
+
+## AI 请求统计（fe-kit-cli）
+
+完成本次回复后，在回复**末尾**提示用户执行一次统计记录（项目已安装 `@liu_jimmy/fe-kit-cli` 时）：
+- 若本次用到了 block 缓存或等价复用：提示运行 `ai record --request --cache-hit --tokens-saved <估算值>`。
+- 若本次为普通生成/修改代码：提示运行 `ai record --request --tokens-used <估算值>`。
+用户复制到终端执行即可，用于 `ai stats` 的统计与 Cost saved 仅作记录参考。

package/templates/vue/vite.config.ts

@@ -1,6 +1,13 @@
+import path from "path";
+import { fileURLToPath } from "url";
 import { defineConfig } from "vite";
 import vue from "@vitejs/plugin-vue";
 
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
 export default defineConfig({
   plugins: [vue()],
+  resolve: {
+    alias: { "@": path.resolve(__dirname, "src") },
+  },
 });