初始化提交

IFLOW.md

@@ -0,0 +1,59 @@
+# SmartisanNote.vue 项目概览
+
+## 项目简介
+
+这是一个基于 Vue 3 和 Vite 构建的单页 Web 应用（SPA），旨在模仿锤子科技（Smartisan）的便签应用。该项目使用 localStorage 进行本地数据持久化，支持便签的增删改查、文件夹管理和基础设置（如云同步、深色模式）。
+
+## 技术栈
+
+*   **核心框架**: Vue 3 (Composition API)
+*   **构建工具**: Vite
+*   **路由管理**: vue-router
+*   **状态管理**: Vue 3 响应式系统 (`reactive`, `provide`, `inject`)
+*   **UI 库**: 原生 CSS，使用了锤子便签的经典配色方案（定义在 `index.html` 的 CSS 变量中）
+*   **移动端支持**: Capacitor (用于构建 Android/iOS 应用)
+*   **代码语言**: JavaScript (ES6+)
+
+## 项目结构
+
+```
+J:\git\SmartisanNote.vue
+├── android/                 # Capacitor Android 项目文件
+├── dist/                    # 构建后的生产文件
+├── node_modules/            # 项目依赖
+├── src/
+│   ├── components/          # 可复用的 Vue 组件 (Header, NoteItem, FolderItem)
+│   ├── pages/               # 页面级别的 Vue 组件 (NoteList, NoteDetail, NoteEditor, Folder, Settings)
+│   ├── utils/               # 工具函数和数据上下文管理
+│   │   ├── AppDataContext.js # 全局状态管理（provide/inject）和数据操作函数
+│   │   └── storage.js       # localStorage 封装，负责数据的读写
+│   ├── App.vue              # 根组件，包裹 AppDataProvider
+│   └── main.js              # 应用入口，初始化路由和挂载
+├── index.html               # HTML 模板，包含 CSS 变量定义
+├── package.json             # 项目元数据和脚本命令
+├── vite.config.js           # Vite 构建配置
+└── capacitor.config.json    # Capacitor 配置文件
+```
+
+## 开发与构建命令
+
+*   **安装依赖**: `npm install`
+*   **启动开发服务器**: `npm run dev`
+    *   默认端口: 3000
+    *   基于 Vite，支持热更新。
+*   **构建生产版本**: `npm run build`
+    *   使用 Vite 构建，并同步到 Capacitor 项目 (`npx cap sync`)。
+*   **预览构建结果**: `npm run preview`
+*   **在 Android 设备上运行**: `npm run android`
+    *   需要预先配置好 Android 开发环境。
+*   **测试**: `npm run test`
+    *   当前脚本未定义具体测试命令。
+
+## 开发规范与约定
+
+*   **状态管理**: 使用 `AppDataContext.js` 中的 `provide`/`inject` 模式进行全局状态管理，避免使用 Vuex 或 Pinia。
+*   **数据持久化**: 所有数据（便签、文件夹、设置）均通过 `src/utils/storage.js` 与 `localStorage` 进行交互。
+*   **路由**: 使用 `vue-router` 和 `createWebHashHistory` 进行前端路由管理。
+*   **UI 风格**: 颜色方案严格遵循 `index.html` 中定义的 CSS 变量，以保持锤子便签的视觉风格。
+*   **组件组织**: 页面组件 (`pages/`) 和可复用组件 (`components/`) 分离，结构清晰。
+*   **代码风格**: 采用标准的 Vue 3 Composition API 写法，使用 ES6 模块系统 (`import`/`export`)。