初始提交：三玩法 Web 原型与设计文档

- 玩法一数字一笔：规则库、求解器、26 关、竖屏触摸 Web 原型、测试 - 玩法二连连气球：连消畅玩版核心、Web 原型、Cocos 球槽组件与导出脚本 - 玩法三六边一笔：规则库、求解器、10 关 + 转墙实验包、Web 原型、测试 - 产品文档、UI 设计规范、各玩法 GDD / HANDOFF - 文档移除全部外部参考作引用；删除玩法二 v0 旧稿
2026-09-16 14:30:59 +08:00
commit 8026e4628d
169 changed files with 22162 additions and 0 deletions
@@ -0,0 +1,42 @@
+// 打包 web/main.ts → web/dist/app.js（IIFE，可 file:// 直接打开）。
+// --serve 时起本地服务并监听改动，手机同一 Wi-Fi 下访问启动时打印的地址。
+// 端口：--port 4000 或 PORT=4000，不给就从 8000 起自动找空闲端口。
+import * as esbuild from 'esbuild';
+import { networkInterfaces } from 'node:os';
+
+const argv = process.argv.slice(2);
+const serve = argv.includes('--serve');
+const portArg = argv[argv.indexOf('--port') + 1];
+const port = argv.includes('--port') ? Number(portArg) : process.env.PORT ? Number(process.env.PORT) : undefined;
+
+const ctx = await esbuild.context({
+  entryPoints: ['web/main.ts'],
+  bundle: true,
+  format: 'iife',
+  target: ['es2020'],
+  outfile: 'web/dist/app.js',
+  sourcemap: serve ? 'inline' : false,
+  minify: !serve,
+  logLevel: 'info',
+  loader: { '.json': 'json' },
+});
+
+if (!serve) {
+  await ctx.rebuild();
+  await ctx.dispose();
+} else {
+  await ctx.watch();
+  const served = await ctx.serve({ servedir: 'web', host: '0.0.0.0', ...(port ? { port } : {}) });
+  let lan = [];
+  try {
+    lan = Object.values(networkInterfaces())
+      .flat()
+      .filter((i) => i && i.family === 'IPv4' && !i.internal)
+      .map((i) => i.address);
+  } catch {
+    // 受限环境拿不到网卡列表，只打印 localhost
+  }
+  console.log(`\n  本机:   http://localhost:${served.port}/`);
+  for (const ip of lan) console.log(`  手机:   http://${ip}:${served.port}/`);
+  console.log(`  (监听 ${served.host}:${served.port}，改动自动重新打包，刷新页面即可)\n`);
+}
@@ -0,0 +1,45 @@
+// 单文件离线版：直接从源码打包，不依赖开发服务器或现有 web/dist。
+// npm run build:standalone [-- /绝对路径/试玩版.html]
+import { mkdir, readFile, writeFile } from 'node:fs/promises';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { build, transform } from 'esbuild';
+
+const root = fileURLToPath(new URL('../', import.meta.url));
+const out = process.argv[2]
+  ? resolve(process.argv[2])
+  : resolve(root, '../../releases/数字一笔-试玩版.html');
+
+const [template, css, bundle] = await Promise.all([
+  readFile(resolve(root, 'web/index.html'), 'utf8'),
+  readFile(resolve(root, 'web/style.css'), 'utf8'),
+  build({
+    absWorkingDir: root,
+    entryPoints: ['web/main.ts'],
+    bundle: true,
+    format: 'iife',
+    target: ['es2020'],
+    minify: true,
+    write: false,
+    legalComments: 'none',
+    loader: { '.json': 'json' },
+  }),
+]);
+const style = (await transform(css, { loader: 'css', minify: true })).code;
+const script = bundle.outputFiles[0].text;
+
+function inlineOnce(html, needle, replacement) {
+  if (html.split(needle).length !== 2) throw new Error(`HTML 入口已变动，需要更新单文件构建脚本：${needle}`);
+  // 回调替换，避免 JS/CSS 内的 $& 等字符被解释为替换指令。
+  return html.replace(needle, () => replacement);
+}
+
+let html = inlineOnce(template, '<link rel="stylesheet" href="style.css" />', `<style>${style.replace(/<\/style/gi, '<\\/style')}</style>`);
+html = inlineOnce(html, '<html lang="zh-CN">', '<html lang="zh-CN" data-unlock-all="true">');
+html = inlineOnce(html, '按数字顺序，一笔走遍每一格', '全部关卡开放，自由选关试玩');
+html = inlineOnce(html, '<script src="dist/app.js"></script>', `<script>${script.replace(/<\/script/gi, '<\\/script')}</script>`);
+html = html.replace('<title>数字一笔</title>', '<title>数字一笔 · 试玩版</title>');
+await mkdir(dirname(out), { recursive: true });
+await writeFile(out, html, 'utf8');
+console.log(`独立 HTML：${out}`);
+console.log(`大小：${(Buffer.byteLength(html) / 1024).toFixed(1)} KB；脚本、样式及全部关卡已内嵌，所有关卡可直接选择。`);