Compare commits

..
2 Commits
Author SHA1 Message Date
labmem cde8281523 Merge branch 'main' of https://git.labmem.icu/labmem/lab 2026-08-17 23:44:23 +08:00
labmem 5263eb3a5f docs(ts): 新增 TypeScript 实验目录及 Astro 项目说明
- 添加 ts/README.md 约定文档(每个实验独立 npm 项目)
- 新增 ts/web/astro/polaris 实验项目说明与 logo
- .gitignore 增加 Node/TypeScript 忽略规则
- 根 README 目录说明补充 ts/ 条目
2026-08-17 23:29:26 +08:00
5 changed files with 181 additions and 0 deletions
+6
View File
@@ -19,6 +19,12 @@ vendor/
.pub/ .pub/
build/ build/
# ---- Node / TypeScript ----
node_modules/
dist/
.astro/
*.tsbuildinfo
# ---- IDE / 编辑器 ---- # ---- IDE / 编辑器 ----
.idea/ .idea/
.vscode/ .vscode/
+1
View File
@@ -6,6 +6,7 @@
- `go/` — Go(共用一个 module,约定见 [go/README.md](go/README.md)) - `go/` — Go(共用一个 module,约定见 [go/README.md](go/README.md))
- `dart/` — Dart - `dart/` — Dart
- `ts/` — TypeScript / JavaScript(每个实验独立 npm 项目,约定见 [ts/README.md](ts/README.md))
## 约定 ## 约定
+32
View File
@@ -0,0 +1,32 @@
# TypeScript / JavaScript 练习区
本目录是 TS/JS 的学习 / 练手代码。与 Go 那边共用一个 module 不同,这里**每个实验是独立的 npm 项目**(各自的 `package.json`、lock 文件)。
## 约定
- **每个叶子目录 = 一个独立实验**:自带 `package.json`,依赖自行管理。
- 多个实验并存互不冲突,框架和版本可以各不相同(一个 Astro 4、一个 Astro 5 都行)。
- `node_modules/`、构建产物(`dist/`、`.astro/` 等)已在根 `.gitignore` 忽略,不会提交。
## 主题目录
| 目录 | 放什么 |
|---|---|
| `basics/` | 语法基础、类型系统、ES 新特性 |
| `web/` | 前端框架:Astro、Vite 等 |
| `node/` | Node.js 后端练习(http、fs、CLI…) |
| `testing/` | 测试机制(Vitest、Playwright…) |
| `project/` | 完整小项目(多文件) |
> 主题目录可随时增删。写新实验时挑最贴的主题,在里面建一个新子目录即可。
## 新建一个 Astro 实验
```bash
cd ts/web/astro
npm create astro@latest my-lab -- --template basics --no-git --install
cd my-lab
npm run dev
```
> `my-lab` 换成实验名;想完全交互式地选模板/TypeScript 严格度,去掉 `--` 后面的参数即可。
+31
View File
@@ -0,0 +1,31 @@
# Polaris(北极星)
个人导航网站(Personal Navigation / 个人主页 + 导航站)。
## 项目背景(记录于开发启动前)
- **项目名**:polaris
- **定位**:个人导航网站 —— 作为个人门户,聚合常用链接 / 站点导航 / 个人介绍等。
- **当前状态**:设计尚未完成,仅完成并存放了 Logo(`logo.svg`)。
- **Logo 风格**:青蓝渐变(`#00F2FE → #3B82F6`)的"极客魔法阵 + 机甲指针"罗盘图形,整体偏深色科技感。
## 技术选型(待定)
- **候选主力框架**:Astro(静态优先、岛屿架构,适合导航站这类以内容/链接为主的站点)。
- 其余(样式方案、部署平台、数据源等)**尚未确定**。
## 待办 / 未决事项
- [ ] 完成整体设计(页面结构、视觉风格、配色是否沿用 Logo 的深色青蓝科技风)
- [ ] 确定技术栈细节:Astro 版本、样式方案(如 Tailwind / UnoCSS)、是否引入 UI 组件
- [ ] 确定内容与数据组织:导航链接的存放方式(Markdown / JSON / 内容集合)
- [ ] 确定部署方式(如 Vercel / Netlify / Cloudflare Pages / 自有服务器)
- [ ] 搭建项目骨架并接入现有 Logo
## 目录
```
polaris/
├── logo.svg # 项目 Logo(唯一现有资产)
└── README.md # 本项目说明(本文件)
```
+111
View File
@@ -0,0 +1,111 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="100%" height="100%">
<!-- 背景透明 -->
<defs>
<!-- 渐变:高亮发光青蓝 到 科技蓝 -->
<linearGradient id="magicCyan" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#00F2FE" />
<stop offset="100%" stop-color="#3B82F6" />
</linearGradient>
<!-- 渐变:深邃蓝 (指针反向切面与暗部) -->
<linearGradient id="magicDark" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#1E293B" />
<stop offset="100%" stop-color="#0F172A" />
</linearGradient>
<!-- 霓虹发光 Glow 滤镜 -->
<filter id="magicGlow" x="-20%" y="-20%" width="140%" height="140%">
<feGaussianBlur stdDeviation="4" result="blur" />
<feComposite in="SourceGraphic" in2="blur" operator="over" />
</filter>
</defs>
<!-- ==================== 丰富高精度的极客魔法阵 (Geek Magic Array) ==================== -->
<!-- 1. 最外层:外边界细环与四角法术引线节点 -->
<circle cx="256" cy="256" r="242" fill="none" stroke="#00F2FE" stroke-width="1.5" stroke-opacity="0.5" />
<circle cx="256" cy="256" r="236" fill="none" stroke="#3B82F6" stroke-width="2.5" stroke-opacity="0.8" />
<!-- 外圈四极极客指示顶点 -->
<path d="M 256 8 L 266 26 L 246 26 Z" fill="#00F2FE" filter="url(#magicGlow)" />
<path d="M 256 504 L 266 486 L 246 486 Z" fill="#2563EB" opacity="0.6" />
<path d="M 8 256 L 26 246 L 26 266 Z" fill="#2563EB" opacity="0.6" />
<path d="M 504 256 L 486 246 L 486 266 Z" fill="#2563EB" opacity="0.6" />
<!-- 2. 精密仪表与符文刻度带 (外环与内环间) -->
<circle cx="256" cy="256" r="226" fill="none" stroke="#00F2FE" stroke-width="6" stroke-dasharray="2 6" stroke-opacity="0.75" />
<circle cx="256" cy="256" r="216" fill="none" stroke="#3B82F6" stroke-width="1.5" stroke-opacity="0.4" />
<!-- 精算刻度环:6个长粗虚线的中心点完全对齐正六边形与角点的 60° 几何角 -->
<circle cx="256" cy="256" r="210" fill="none" stroke="#00F2FE" stroke-width="4.5"
stroke-dasharray="25 8 6 15.977872" stroke-dashoffset="-12.5" stroke-opacity="0.85" filter="url(#magicGlow)" />
<!-- 3. 魔法阵三重嵌套多边形结界 (正三角形 + 正六边形 + 12角星线拓扑) -->
<g fill="none" stroke="#3B82F6" stroke-width="1.5" stroke-opacity="0.5">
<!-- 正六边形 A (顶角精确落于 r=210 粗虚线长段) -->
<polygon points="256,46 437.86,151 437.86,361 256,466 74.14,361 74.14,151" stroke="#00F2FE" stroke-width="1.8" stroke-opacity="0.7" />
<!-- 正六边形 B (旋转30度) -->
<polygon points="361,74.14 466,256 361,437.86 151,437.86 46,256 151,74.14" />
<!-- 正三角形 C (向上) -->
<polygon points="256,46 437.86,361 74.14,361" stroke="#00F2FE" stroke-width="1" stroke-opacity="0.4" />
<!-- 正三角形 D (向下) -->
<polygon points="256,466 74.14,151 437.86,151" stroke="#00F2FE" stroke-width="1" stroke-opacity="0.4" />
</g>
<!-- 4. 六方位魔法法阵节点圈 (在多边形顶点上的极客元素) -->
<g fill="#0F172A" stroke="#00F2FE" stroke-width="2" opacity="0.95">
<circle cx="256" cy="46" r="10" />
<circle cx="437.86" cy="151" r="10" />
<circle cx="437.86" cy="361" r="10" />
<circle cx="256" cy="466" r="10" />
<circle cx="74.14" cy="361" r="10" />
<circle cx="74.14" cy="151" r="10" />
</g>
<!-- 节点内发光核 -->
<g fill="#00F2FE" filter="url(#magicGlow)">
<circle cx="256" cy="46" r="4" />
<circle cx="437.86" cy="151" r="4" />
<circle cx="437.86" cy="361" r="4" />
<circle cx="256" cy="466" r="4" />
<circle cx="74.14" cy="361" r="4" />
<circle cx="74.14" cy="151" r="4" />
</g>
<!-- 5. 中阶魔法阵环与细分刻度 -->
<circle cx="256" cy="256" r="186" fill="none" stroke="#00F2FE" stroke-width="2" stroke-opacity="0.8" filter="url(#magicGlow)" />
<circle cx="256" cy="256" r="176" fill="none" stroke="#2563EB" stroke-width="3" stroke-dasharray="12 6 4 6" stroke-opacity="0.6" />
<circle cx="256" cy="256" r="166" fill="none" stroke="#00F2FE" stroke-width="1" stroke-dasharray="2 4" stroke-opacity="0.5" />
<!-- 6. 魔法阵放射状流向线 (16等分星射线) -->
<g stroke="#00F2FE" stroke-width="1" stroke-opacity="0.2">
<line x1="256" y1="26" x2="256" y2="486" />
<line x1="26" y1="256" x2="486" y2="256" />
<line x1="93" y1="93" x2="419" y2="419" />
<line x1="419" y1="93" x2="93" y2="419" />
</g>
<!-- ==================== 中心:硬核极客机甲指针 (中间区域干净无符号) ==================== -->
<g transform="rotate(28, 256, 256)">
<!-- 北向主指针(立体几何亮蓝切面) -->
<path d="M 256 70 L 306 226 L 256 256 Z" fill="url(#magicCyan)" filter="url(#magicGlow)" />
<!-- 北向副切面(深蓝阴影) -->
<path d="M 256 70 L 206 226 L 256 256 Z" fill="#1D4ED8" />
<!-- 指针侧翼机甲组件 -->
<path d="M 312 236 L 332 266 L 282 256 Z" fill="#00F2FE" opacity="0.7" />
<path d="M 200 236 L 180 266 L 230 256 Z" fill="#2563EB" opacity="0.7" />
<!-- 南向反向指针(深色金属质感) -->
<path d="M 256 442 L 220 286 L 256 256 Z" fill="url(#magicDark)" />
<path d="M 256 442 L 292 286 L 256 256 Z" fill="#334155" />
</g>
<!-- 中心核心:反应堆式同心轴 -->
<circle cx="256" cy="256" r="32" fill="#0F172A" stroke="#00F2FE" stroke-width="3" />
<circle cx="256" cy="256" r="18" fill="none" stroke="#3B82F6" stroke-width="2" stroke-dasharray="6 3" />
<circle cx="256" cy="256" r="8" fill="#00F2FE" filter="url(#magicGlow)" />
<circle cx="256" cy="256" r="3" fill="#FFFFFF" />
</svg>

After

Width:  |  Height:  |  Size: 5.6 KiB