create-next-imagicma 0.1.0 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -2,6 +2,11 @@
2
2
 
3
3
  一个极简项目脚手架,用于从本仓库模板快速生成新项目。支持双模板:`hono` 与 `next`。
4
4
 
5
+ ## 模版源
6
+
7
+ - `../nextjs-app`
8
+ - `../hono-app`
9
+ 如果要修改模版,请修改源头,然后执行 `pnpm run sync-template` 同步到当前模版目录,切记不可直接修改当前模版目录。
5
10
  ## 使用
6
11
 
7
12
  ```bash
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-next-imagicma",
3
- "version": "0.1.0",
3
+ "version": "0.1.2",
4
4
  "type": "module",
5
5
  "bin": {
6
6
  "create-next-imagicma": "./bin/create-next-imagicma.mjs"
@@ -58,14 +58,13 @@
58
58
 
59
59
  ## UI 质量门禁(必须全部满足)
60
60
 
61
- - 首页不得空白,不得仅显示默认模板文案。
61
+ - `/` 路由必须可访问并落到首页组件。
62
+ - 接入真实业务时,应将 `/` 首页替换为业务内容,不要长期保留模板默认文案。
62
63
  - 视觉风格必须明确:字体、颜色、间距、动效要统一。
63
- - 禁止“紫色渐变 + 白底默认感”模板化输出。
64
64
  - 必须定义可复用设计 token(颜色、圆角、阴影、间距等级)。
65
65
  - 至少覆盖桌面与移动端关键断点,不允许内容溢出。
66
66
  - 交互状态完整:hover/focus/disabled/loading/error/success。
67
67
  - 在 `<Button>` 上使用自定义背景色类(如 `bg-*`)时,必须同时显式声明文本色类(如 `text-*`);禁止只改背景不改文字色。
68
- - Todo 类页面优先采用单主轴布局(标题区 + 输入区 + 列表区),避免信息噪音过载。
69
68
  - 优先复用 `Input/Button/Card/Checkbox/Select` 的默认视觉语言,必要时只做局部增强,不要重写整套样式。
70
69
  - 列表增删改状态建议加入轻量动效(如 `framer-motion` 的入场/退出),并提供失败反馈(toast 或 inline alert)。
71
70
 
@@ -82,6 +81,7 @@
82
81
 
83
82
  - `pnpm build` 通过(无 pnpm 时 `npm run build` 通过)
84
83
  - 页面可在本地端口访问并完成核心流程
84
+ - `/` 首页路由可访问(允许临时隐藏默认模板 DOM)
85
85
  - `run_test` 返回 `[run_test] ok`
86
86
  - 关键日志无阻塞级错误
87
87
  - UI 达到可演示级(非“功能可用但观感粗糙”)
@@ -3,7 +3,7 @@
3
3
  var VERSION = 1;
4
4
  var MAX_TEXT_LENGTH = 240;
5
5
  var MAX_SELECTOR_LENGTH = 512;
6
- var PROD_PARENT_ORIGIN = 'https://www.imagicma.cn';
6
+ var PROD_PARENT_ORIGIN = 'https://imagicma.cn';
7
7
  var LOCAL_PARENT_RE = /^https?:\/\/(localhost|127\.0\.0\.1)(:\d+)?$/i;
8
8
  var LOCAL_IMAGICMA_PARENT_RE = /^https?:\/\/([a-z0-9-]+\.)?local\.imagicma\.cn(:\d+)?$/i;
9
9
 
@@ -1,13 +1,12 @@
1
- import { Navigate, Route, Routes } from "react-router-dom";
2
- import { HelloPage } from "./pages/HelloPage";
3
- import { HomePage } from "./pages/HomePage";
1
+ import { Route, Routes } from "react-router-dom";
2
+ import Home from "./pages/home";
3
+ import NotFound from "./pages/not-found";
4
4
 
5
5
  export function App() {
6
6
  return (
7
7
  <Routes>
8
- <Route path="/" element={<HomePage />} />
9
- <Route path="/hello" element={<HelloPage />} />
10
- <Route path="*" element={<Navigate to="/" replace />} />
8
+ <Route path="/" element={<Home />} />
9
+ <Route path="*" element={<NotFound />} />
11
10
  </Routes>
12
11
  );
13
12
  }
@@ -0,0 +1,6 @@
1
+ export default function Home() {
2
+ return (
3
+ <div style={{ display: "none" }}>请优先修改本页</div>
4
+ );
5
+ }
6
+
@@ -0,0 +1,21 @@
1
+ import { Card, CardContent } from "@/components/ui/card";
2
+ import { AlertCircle } from "lucide-react";
3
+
4
+ export default function NotFound() {
5
+ return (
6
+ <div className="min-h-screen w-full flex items-center justify-center bg-gray-50">
7
+ <Card className="w-full max-w-md mx-4">
8
+ <CardContent className="pt-6">
9
+ <div className="flex mb-4 gap-2">
10
+ <AlertCircle className="h-8 w-8 text-red-500" />
11
+ <h1 className="text-2xl font-bold text-gray-900">404 Page Not Found</h1>
12
+ </div>
13
+
14
+ <p className="mt-4 text-sm text-gray-600">
15
+ Did you forget to add the page to the router?
16
+ </p>
17
+ </CardContent>
18
+ </Card>
19
+ </div>
20
+ );
21
+ }
@@ -1,22 +0,0 @@
1
- import { HelloClient } from "../components/HelloClient";
2
-
3
- export function HelloPage() {
4
- return (
5
- <div className="min-h-screen bg-background text-foreground">
6
- <div className="mx-auto max-w-3xl px-6 py-12">
7
- <div className="space-y-2">
8
- <h1 className="text-3xl font-semibold tracking-tight">
9
- Replit 模板精华迁移验证
10
- </h1>
11
- <p className="text-sm text-muted-foreground">
12
- 该页面用于验证:shadcn/ui、React Query、Hono API、Drizzle/Postgres。
13
- </p>
14
- </div>
15
-
16
- <div className="mt-8">
17
- <HelloClient />
18
- </div>
19
- </div>
20
- </div>
21
- );
22
- }
@@ -1,30 +0,0 @@
1
- export function HomePage() {
2
- return (
3
- <div className="relative min-h-screen overflow-hidden bg-gradient-to-br from-indigo-600 via-purple-600 to-sky-600 text-white">
4
- <div
5
- aria-hidden
6
- className="pointer-events-none absolute inset-0 overflow-hidden"
7
- >
8
- <div className="absolute inset-0 bg-[radial-gradient(60%_60%_at_50%_40%,rgba(255,255,255,0.20),transparent_60%)]" />
9
- </div>
10
-
11
- <div aria-hidden className="aurora-frame">
12
- <span className="aurora-edge top" />
13
- <span className="aurora-edge right" />
14
- <span className="aurora-edge bottom" />
15
- <span className="aurora-edge left" />
16
- <span className="aurora-edge top is-glow" />
17
- <span className="aurora-edge right is-glow" />
18
- <span className="aurora-edge bottom is-glow" />
19
- <span className="aurora-edge left is-glow" />
20
- </div>
21
-
22
- <main className="relative z-[1] flex min-h-screen items-center justify-center">
23
- <div role="status" aria-live="polite">
24
- <span className="sr-only">加载中</span>
25
- <div className="h-10 w-10 rounded-full border-[3px] border-white/25 border-t-white/90 motion-reduce:animate-none animate-spin" />
26
- </div>
27
- </main>
28
- </div>
29
- );
30
- }