create-librex 1.0.1

package/index.mjs

@@ -0,0 +1,110 @@
+#!/usr/bin/env node
+
+/**
+ * create-librex — LibreX 项目脚手架
+ *
+ * 用法: npm create librex@latest [project-name]
+ */
+
+import * as fs from 'node:fs'
+import * as path from 'node:path'
+import { fileURLToPath } from 'node:url'
+import * as readline from 'node:readline'
+import { execSync, spawn } from 'node:child_process'
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
+const TEMPLATE_DIR = path.join(__dirname, 'template')
+
+// ── ANSI ──
+const c = {
+  reset: '\x1b[0m', bold: '\x1b[1m', dim: '\x1b[2m',
+  green: '\x1b[32m', cyan: '\x1b[36m', yellow: '\x1b[33m',
+  red: '\x1b[31m', magenta: '\x1b[35m',
+}
+
+// ── 工具 ──
+function ask(rl, q) { return new Promise(r => rl.question(q, r)) }
+
+function toKebab(str) {
+  return str.replace(/([a-z0-9])([A-Z])/g, '$1-$2').replace(/[\s_]+/g, '-').toLowerCase()
+}
+
+// ══════════════════════════════════════════
+// 文件拷贝 — 跳过 _gitignore → .gitignore 重命名
+// ══════════════════════════════════════════
+function copyDir(src, dest) {
+  if (!fs.existsSync(dest)) fs.mkdirSync(dest, { recursive: true })
+  for (const entry of fs.readdirSync(src, { withFileTypes: true })) {
+    const srcPath = path.join(src, entry.name)
+    let destName = entry.name
+    if (destName === '_gitignore') destName = '.gitignore'
+    const destPath = path.join(dest, destName)
+    if (entry.isDirectory()) {
+      copyDir(srcPath, destPath)
+    } else {
+      fs.copyFileSync(srcPath, destPath)
+    }
+  }
+}
+
+// ══════════════════════════════════════════
+// 主流程
+// ══════════════════════════════════════════
+
+async function main() {
+  const rl = readline.createInterface({ input: process.stdin, output: process.stdout })
+
+  console.log(`\n  ${c.magenta}┌──────────────────────────────────────────┐${c.reset}`)
+  console.log(`  ${c.magenta}│${c.reset}  ${c.bold}LibreX${c.reset}  —  积木式后台管理框架         ${c.magenta}│${c.reset}`)
+  console.log(`  ${c.magenta}└──────────────────────────────────────────┘${c.reset}\n`)
+
+  // ── 项目名 ──
+  let projectName = process.argv[2]
+  if (!projectName) {
+    projectName = (await ask(rl, `  ${c.green}?${c.reset} 项目名称 ${c.dim}(librex-app):${c.reset} `)).trim()
+  }
+  if (!projectName) projectName = 'librex-app'
+  projectName = toKebab(projectName)
+
+  const targetDir = path.join(process.cwd(), projectName)
+
+  if (fs.existsSync(targetDir)) {
+    console.log(`\n  ${c.yellow}⚠ 目录 "${projectName}" 已存在${c.reset}`)
+    const answer = (await ask(rl, `  ${c.green}?${c.reset} 是否覆盖? ${c.dim}(y/N):${c.reset} `)).trim().toLowerCase()
+    if (answer !== 'y') {
+      console.log(`  ${c.dim}已取消${c.reset}\n`)
+      rl.close()
+      return
+    }
+    fs.rmSync(targetDir, { recursive: true, force: true })
+  }
+
+  rl.close()
+
+  // ── 拷贝模板 ──
+  console.log(`\n  ${c.green}✧${c.reset}  创建项目 ${c.cyan}${projectName}${c.reset} ...`)
+  copyDir(TEMPLATE_DIR, targetDir)
+
+  // ── 写入项目名到 package.json ──
+  const pkgPath = path.join(targetDir, 'package.json')
+  const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf-8'))
+  pkg.name = projectName
+  fs.writeFileSync(pkgPath, JSON.stringify(pkg, null, 2) + '\n')
+
+  // ── 安装依赖 ──
+  console.log(`  ${c.green}✧${c.reset}  安装依赖 ...\n`)
+  try {
+    execSync('npm install', { cwd: targetDir, stdio: 'inherit' })
+  } catch {
+    console.log(`\n  ${c.yellow}⚠ 依赖安装失败，请手动运行 npm install${c.reset}`)
+  }
+
+  console.log(`\n  ${c.green}Done${c.reset}  项目创建完成\n`)
+  console.log(`    ${c.dim}cd${c.reset} ${c.cyan}${projectName}${c.reset}`)
+  console.log(`    ${c.dim}npm run dev${c.reset}\n`)
+}
+
+main().catch(err => {
+  console.error(`${c.red}创建失败:${c.reset}`, err.message)
+  process.exit(1)
+})

package/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "create-librex",
+  "version": "1.0.1",
+  "description": "LibreX — 积木式后台管理框架项目脚手架",
+  "type": "module",
+  "bin": {
+    "create-librex": "./index.mjs"
+  },
+  "files": [
+    "index.mjs",
+    "template"
+  ],
+  "keywords": [
+    "librex",
+    "create-librex",
+    "admin",
+    "framework",
+    "vue",
+    "scaffold"
+  ],
+  "license": "MIT"
+}

package/template/.env.development

@@ -0,0 +1 @@
+VITE_PROXY_TARGET=http://localhost:3000

package/template/_gitignore

@@ -0,0 +1,23 @@
+# Dependencies
+node_modules/
+
+# Build
+dist/
+
+# Dev
+*.local
+.env.local
+.env.*.local
+
+# IDE
+.vscode/*
+!.vscode/extensions.json
+.idea/
+
+# OS
+.DS_Store
+Thumbs.db
+
+# Logs
+*.log
+npm-debug.log*

package/template/env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

package/template/index.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>LibreX</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

package/template/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "librex-app",
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vue-tsc -b && vite build",
+    "preview": "vite preview",
+    "typecheck": "vue-tsc --noEmit",
+    "create": "node scripts/create-page.mjs",
+    "create:page": "npm run create"
+  },
+  "dependencies": {
+    "librex": "^1.0.0",
+    "pinia": "^3.0.0",
+    "vue": "^3.5.0",
+    "vue-router": "^5.0.0"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^6.0.0",
+    "typescript": "^5.7.0",
+    "vite": "^8.0.0",
+    "vue-tsc": "^2.0.0",
+    "less": "^4.2.0"
+  }
+}

package/template/scripts/create-page.mjs

@@ -0,0 +1,453 @@
+#!/usr/bin/env node
+
+/**
+ * Librex 页面创建器
+ *
+ * 用法:
+ *   npm run create
+ *   npm run create:page
+ */
+
+import * as readline from 'node:readline'
+import * as fs from 'node:fs'
+import * as path from 'node:path'
+import { fileURLToPath } from 'node:url'
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
+const ROOT = path.resolve(__dirname, '..')
+const PAGES_DIR = path.join(ROOT, 'src', 'pages')
+
+// ── ANSI 颜色 ──
+const c = {
+  reset: '\x1b[0m',
+  bold: '\x1b[1m',
+  dim: '\x1b[2m',
+  green: '\x1b[32m',
+  cyan: '\x1b[36m',
+  yellow: '\x1b[33m',
+  red: '\x1b[31m',
+  magenta: '\x1b[35m',
+}
+
+// ── TypeScript 转 kebab-case ──
+function toKebabCase(str) {
+  return str
+    .replace(/([a-z0-9])([A-Z])/g, '$1-$2')
+    .replace(/[\s_]+/g, '-')
+    .toLowerCase()
+}
+
+function toPascalCase(str) {
+  return str
+    .split(/[-_\s]+/)
+    .map(w => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase())
+    .join('')
+}
+
+// ── 提示工具 ──
+function createPrompter() {
+  const rl = readline.createInterface({
+    input: process.stdin,
+    output: process.stdout,
+  })
+  return {
+    ask(question) {
+      return new Promise(resolve => rl.question(question, resolve))
+    },
+    close() {
+      rl.close()
+    },
+  }
+}
+
+// ══════════════════════════════════════════
+// 模板生成器
+// ══════════════════════════════════════════
+
+/** table 类型 — 表格列表页（最常用），带增删改查 + 导出 */
+function templateTable(config) {
+  const { title, pagePath, icon, navGroup, navOrder, name } = config
+  const navOrderLine = navOrder !== undefined ? `\n  navOrder: ${navOrder},` : ''
+  const navGroupLine = navGroup ? `\n  navGroup: '${navGroup}',` : ''
+
+  return `import { definePageConfig, useContext, useConfirm } from 'librex'
+
+export default definePageConfig({
+  title: '${title}',
+  path: '${pagePath}',
+  icon: '${icon}',${navOrderLine}${navGroupLine}
+
+  // 只声明 LDataTable，框架自动推论 LRowActionBar + LBatchActionBar 配套积木
+  builtinBricks: ['LDataTable'],
+
+  // 编辑走 overlay 覆层 — LForm 积木自动读 ctx.formFields 渲染
+  overlayBrick: 'LForm',
+
+  setup({ setTableData, setTableColumns, setFormFields, setPageHooks }) {
+    // store 引用 — 实时读取 tableData/tableColumns，用于 hooks 闭包
+    const store = useContext()
+    const confirmStore = useConfirm()
+
+    // 表格列定义
+    setTableColumns([
+      { key: 'id', label: 'ID', sortable: true, width: 60 },
+      { key: 'name', label: '名称', sortable: true },
+      { key: 'desc', label: '描述' },
+      { key: 'status', label: '状态' },
+    ])
+
+    // 表格数据（替换为实际 API 调用）
+    setTableData([
+      { id: 1, name: '示例数据 1', desc: '描述文本', status: 1 },
+      { id: 2, name: '示例数据 2', desc: '描述文本', status: 0 },
+    ])
+
+    // 表单字段 — LForm overlay 编辑时使用
+    setFormFields([
+      { key: 'name', label: '名称', fieldType: 'input', required: true },
+      { key: 'desc', label: '描述', fieldType: 'textarea' },
+      {
+        key: 'status',
+        label: '状态',
+        fieldType: 'select',
+        props: {
+          options: [
+            { label: '启用', value: 1 },
+            { label: '禁用', value: 0 },
+          ],
+        },
+      },
+    ])
+
+    // 页面行为 — 使用框架统一确认模态框
+    setPageHooks({
+      onDelete: async (row) => {
+        const confirmed = await confirmStore.confirmDelete([row.id as number])
+        if (!confirmed) return
+        store.setTableData((store.tableData as any[]).filter((r: any) => r.id !== row.id))
+        store.pushNotification({ type: 'success', title: '已删除' })
+      },
+
+      onBatchDelete: async (ids) => {
+        const confirmed = await confirmStore.confirmDelete(ids)
+        if (!confirmed) return
+        store.removeRows(ids)
+        store.clearSelection()
+        store.pushNotification({ type: 'success', title: \`已删除 \${ids.length} 条\` })
+      },
+
+      onSave: async (item) => {
+        // 新建 / 编辑保存逻辑
+        // const saved = item.id
+        //   ? await api.update(item.id, item)
+        //   : await api.create(item)
+        return { ...item }
+      },
+    })
+  },
+})
+`
+}
+
+/** form 类型 — 表单/详情页，带 LForm + LPageNavBar */
+function templateForm(config) {
+  const { title, pagePath, icon, navGroup, navOrder, name } = config
+  const navOrderLine = navOrder !== undefined ? `\n  navOrder: ${navOrder},` : ''
+  const navGroupLine = navGroup ? `\n  navGroup: '${navGroup}',` : ''
+
+  return `import { definePageConfig } from 'librex'
+
+export default definePageConfig({
+  title: '${title}',
+  path: '${pagePath}',
+  icon: '${icon}',${navOrderLine}${navGroupLine}
+
+  builtinBricks: ['LForm', 'LPageNavBar'],
+
+  // 详情/编辑页默认进入 reviewing 状态
+  defaultState: 'reviewing',
+
+  setup({ setFormFields, setTableData }) {
+    // 表单字段定义
+    setFormFields([
+      { key: 'id', label: 'ID', fieldType: 'input', modes: { edit: { visible: false }, create: { visible: false } } },
+      { key: 'name', label: '名称', fieldType: 'input', required: true },
+      { key: 'desc', label: '描述', fieldType: 'textarea' },
+      {
+        key: 'status',
+        label: '状态',
+        fieldType: 'select',
+        props: {
+          options: [
+            { label: '启用', value: 1 },
+            { label: '禁用', value: 0 },
+          ],
+        },
+      },
+    ])
+
+    // 示例数据（替换为实际 API 调用，如根据路由参数 id 加载详情）
+    setTableData([
+      { id: 1, name: '示例名称', desc: '示例描述', status: 1 },
+    ])
+  },
+})
+`
+}
+
+/** custom 类型 — 自定义 Vue 积木组件页面 */
+function templateCustom(config) {
+  const { title, pagePath, icon, navGroup, navOrder, name } = config
+  const navOrderLine = navOrder !== undefined ? `\n  navOrder: ${navOrder},` : ''
+  const navGroupLine = navGroup ? `\n  navGroup: '${navGroup}',` : ''
+  const componentName = toPascalCase(name) + 'View'
+
+  return {
+    pageConfig: `import { definePageConfig } from 'librex'
+import ${componentName} from './${componentName}.vue'
+
+export default definePageConfig({
+  title: '${title}',
+  path: '${pagePath}',
+  icon: '${icon}',${navOrderLine}${navGroupLine}
+
+  bricks: {
+    ${componentName}: {
+      component: ${componentName},
+      tier: 'content',
+      position: 'center',
+    },
+  },
+})
+`,
+    vueComponent: `<template>
+  <div class="${toKebabCase(name)}-wrap">
+    <div class="page-header">
+      <h2>${title}</h2>
+      <p class="page-desc">页面描述，可根据实际需求修改。</p>
+    </div>
+    <div class="page-body">
+      <!-- 在此编写页面内容 -->
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+// 在此编写页面逻辑
+const loading = ref(false)
+</script>
+
+<style scoped>
+.${toKebabCase(name)}-wrap {
+  padding: 24px;
+}
+
+.page-header {
+  margin-bottom: 24px;
+}
+
+.page-header h2 {
+  margin: 0 0 8px;
+  font-size: 20px;
+  font-weight: 600;
+  color: var(--color-text-primary);
+}
+
+.page-desc {
+  margin: 0;
+  font-size: 14px;
+  color: var(--color-text-tertiary);
+}
+</style>
+`,
+  }
+}
+
+/** mixed 类型 — 多积木混合页（内置积木 + setup + 树/搜索） */
+function templateMixed(config) {
+  const { title, pagePath, icon, navGroup, navOrder, name } = config
+  const navOrderLine = navOrder !== undefined ? `\n  navOrder: ${navOrder},` : ''
+  const navGroupLine = navGroup ? `\n  navGroup: '${navGroup}',` : ''
+
+  return `import { definePageConfig, useContext, useConfirm } from 'librex'
+
+export default definePageConfig({
+  title: '${title}',
+  path: '${pagePath}',
+  icon: '${icon}',${navOrderLine}${navGroupLine}
+
+  builtinBricks: ['LDataTable', 'LSearchBar', 'LFilterPanel', 'LTreeNav'],
+
+  states: {
+    idle: {
+      LSearchBar: 'visible',
+      LFilterPanel: 'visible',
+      LTreeNav: 'visible',
+    },
+  },
+
+  setup({ setTableData, setTableColumns, setTreeData, setPageHooks }) {
+    const store = useContext()
+    const confirmStore = useConfirm()
+
+    setTableColumns([
+      { key: 'id', label: 'ID', sortable: true, width: 60 },
+      { key: 'name', label: '名称', sortable: true },
+      { key: 'status', label: '状态', sortable: true },
+    ])
+
+    setTableData([
+      { id: 1, name: '系统 A', status: '运行中' },
+      { id: 2, name: '系统 B', status: '维护中' },
+      { id: 3, name: '模块 C', status: '运行中' },
+      { id: 4, name: '服务 D', status: '已停止' },
+    ])
+
+    setTreeData([
+      { id: 100, label: '分类一', count: 4, expanded: true, children: [
+        { id: 101, label: '子分类 A', count: 2, expanded: false },
+        { id: 102, label: '子分类 B', count: 2, expanded: false },
+      ]},
+      { id: 200, label: '分类二', count: 0, expanded: false },
+    ])
+
+    // 统一使用框架确认模态框
+    setPageHooks({
+      onDelete: async (row) => {
+        const confirmed = await confirmStore.confirmDelete([row.id as number])
+        if (!confirmed) return
+        store.setTableData((store.tableData as any[]).filter((r: any) => r.id !== row.id))
+        store.pushNotification({ type: 'success', title: '已删除' })
+      },
+      onBatchDelete: async (ids) => {
+        const confirmed = await confirmStore.confirmDelete(ids)
+        if (!confirmed) return
+        store.removeRows(ids)
+        store.clearSelection()
+        store.pushNotification({ type: 'success', title: \`已删除 \${ids.length} 条\` })
+      },
+    })
+  },
+})
+`
+}
+
+const TEMPLATES = {
+  table: { fn: templateTable, desc: '表格列表页 — LDataTable + overlay LForm 编辑，支持增删改查 + 导出' },
+  form: { fn: templateForm, desc: '表单/详情页 — LForm + LPageNavBar，路径通常带 :id 参数' },
+  custom: { fn: templateCustom, desc: '自定义积木页 — 生成 .vue 组件 + 声明式挂载' },
+  mixed: { fn: templateMixed, desc: '多积木混合页 — 表格 + 搜索 + 筛选 + 树形导航' },
+}
+
+// ══════════════════════════════════════════
+// 主流程
+// ══════════════════════════════════════════
+
+async function main() {
+  const prompter = createPrompter()
+
+  console.log(`\n  ${c.magenta}┌──────────────────────────────┐${c.reset}`)
+  console.log(`  ${c.magenta}│${c.reset}  ${c.bold}LibreX  ─  create page${c.reset}    ${c.magenta}│${c.reset}`)
+  console.log(`  ${c.magenta}└──────────────────────────────┘${c.reset}`)
+  console.log(`  ${c.dim}声明式页面配置，路由编译期自动注册。${c.reset}\n`)
+
+  // ── 页面目录名 ──
+  let name = ''
+  while (!name) {
+    name = (await prompter.ask(`  ${c.green}?${c.reset} 目录名 ${c.dim}(kebab-case):${c.reset} `)).trim()
+    if (!name) {
+      console.log(`  ${c.red}名称不能为空${c.reset}`)
+      continue
+    }
+    // 规范化
+    name = toKebabCase(name)
+    if (fs.existsSync(path.join(PAGES_DIR, name))) {
+      console.log(`  ${c.yellow}⚠ 目录 "${name}" 已存在${c.reset}`)
+      const overwrite = (await prompter.ask(`  ${c.green}?${c.reset} 是否覆盖? ${c.dim}(y/N)${c.reset} `)).trim().toLowerCase()
+      if (overwrite !== 'y') {
+        console.log(`  ${c.dim}已取消${c.reset}`)
+        prompter.close()
+        return
+      }
+    }
+  }
+
+  // ── 标题 ──
+  let title = (await prompter.ask(`  ${c.green}?${c.reset} 标题 ${c.dim}(${name}):${c.reset} `)).trim()
+  if (!title) title = name
+
+  // ── 路由 ──
+  const defaultPath = `/${name}`
+  let pagePath = (await prompter.ask(`  ${c.green}?${c.reset} 路由 ${c.dim}(${defaultPath}):${c.reset} `)).trim()
+  if (!pagePath) pagePath = defaultPath
+  if (!pagePath.startsWith('/')) pagePath = '/' + pagePath
+
+  // ── 类型 ──
+  console.log('')
+  console.log(`  ${c.bold}页面类型:${c.reset}`)
+  const typeOrder = ['table', 'form', 'mixed', 'custom']
+  typeOrder.forEach((t, i) => {
+    console.log(`    ${c.green}${i + 1}${c.reset}. ${c.bold}${t}${c.reset} — ${c.dim}${TEMPLATES[t].desc}${c.reset}`)
+  })
+  console.log('')
+  let pageType = ''
+  while (!TEMPLATES[pageType]) {
+    const answer = (await prompter.ask(`  ${c.green}?${c.reset} 类型 ${c.dim}(1):${c.reset} `)).trim()
+    const idx = parseInt(answer, 10)
+    if (idx >= 1 && idx <= 4) pageType = typeOrder[idx - 1]
+    else if (!answer) pageType = 'table'
+    else if (TEMPLATES[answer]) pageType = answer
+  }
+
+  // ── 图标 / 分组 / 排序 ──
+  const iconMap = { table: 'database', form: 'file-text', custom: 'layout', mixed: 'layers' }
+  const defaultIcon = iconMap[pageType]
+  let icon = (await prompter.ask(`  ${c.green}?${c.reset} 图标 ${c.dim}(${defaultIcon}):${c.reset} `)).trim()
+  if (!icon) icon = defaultIcon
+
+  let navGroup = (await prompter.ask(`  ${c.green}?${c.reset} 分组 ${c.dim}(可选):${c.reset} `)).trim()
+  let navOrder = undefined
+  const orderAnswer = (await prompter.ask(`  ${c.green}?${c.reset} 排序 ${c.dim}(可选):${c.reset} `)).trim()
+  if (orderAnswer && !isNaN(parseInt(orderAnswer, 10))) {
+    navOrder = parseInt(orderAnswer, 10)
+  }
+
+  prompter.close()
+
+  // ── 摘要 ──
+  console.log(`\n  ${c.magenta}┌─ create ${c.bold}${pageType}${c.reset}${c.magenta} ─────────────────────┐${c.reset}`)
+  console.log(`  ${c.magenta}│${c.reset}  ${c.cyan}src/pages/${name}/${c.reset}`)
+  console.log(`  ${c.magenta}│${c.reset}  ${c.dim}title:${c.reset} ${title}`)
+  console.log(`  ${c.magenta}│${c.reset}  ${c.dim}path:${c.reset}  ${pagePath}`)
+  if (navGroup) console.log(`  ${c.magenta}│${c.reset}  ${c.dim}group:${c.reset} ${navGroup}`)
+  if (navOrder !== undefined) console.log(`  ${c.magenta}│${c.reset}  ${c.dim}order:${c.reset} ${navOrder}`)
+  console.log(`  ${c.magenta}└────────────────────────────────┘${c.reset}\n`)
+
+  // ── 生成 ──
+  const targetDir = path.join(PAGES_DIR, name)
+  fs.mkdirSync(targetDir, { recursive: true })
+
+  const templateFn = TEMPLATES[pageType].fn
+  const config = { title, pagePath, icon, navGroup, navOrder, name }
+
+  if (pageType === 'custom') {
+    const result = templateFn(config)
+    fs.writeFileSync(path.join(targetDir, 'pageConfig.ts'), result.pageConfig, 'utf-8')
+    fs.writeFileSync(path.join(targetDir, `${toPascalCase(name)}View.vue`), result.vueComponent, 'utf-8')
+    console.log(`  ${c.green}✔${c.reset} ${c.cyan}${name}/pageConfig.ts${c.reset}`)
+    console.log(`  ${c.green}✔${c.reset} ${c.cyan}${name}/${toPascalCase(name)}View.vue${c.reset}`)
+  } else {
+    const content = templateFn(config)
+    fs.writeFileSync(path.join(targetDir, 'pageConfig.ts'), content, 'utf-8')
+    console.log(`  ${c.green}✔${c.reset} ${c.cyan}${name}/pageConfig.ts${c.reset}`)
+  }
+
+  console.log(`\n  ${c.green}Done${c.reset}  ${c.dim}→${c.reset}  ${c.cyan}${pagePath}${c.reset}\n`)
+}
+
+main().catch((err) => {
+  console.error(`${c.red}✗ 生成失败:${c.reset}`, err.message)
+  process.exit(1)
+})

package/template/src/App.vue

@@ -0,0 +1,19 @@
+<template>
+  <SystemShell v-if="!isLoginPage">
+    <router-view v-slot="{ Component, route }">
+      <component :is="Component" :key="route.path" />
+    </router-view>
+  </SystemShell>
+  <router-view v-else v-slot="{ Component, route }">
+    <component :is="Component" :key="route.path" />
+  </router-view>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useRoute } from 'vue-router'
+import SystemShell from 'librex'
+
+const route = useRoute()
+const isLoginPage = computed(() => route.path === '/login')
+</script>