feat: MetonaSqlark v0.1.12 — 前端TypeScript关系型数据库

- 4种存储引擎：Memory / IndexedDB / OPFS / Hybrid - 完整SQL：SELECT/INSERT/UPDATE/DELETE/JOIN/GROUP BY/HAVING/DISTINCT - Query Builder链式API + TypeScript泛型 - 聚合/事务/插件/发布订阅/迁移/导入导出 - React/Vue集成，264测试，93.46%覆盖率，零运行时依赖
2026-07-26 15:18:45 +08:00
parent e2a590c5b1
commit 7858cf3720
14 changed files with 9086 additions and 62 deletions
@@ -3,7 +3,7 @@
 <head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>在线演示 — metona-sqlark</title>
+<title>在线演示 — MetonaSqlark</title>
 <style>
  :root {
    --bg:#0a0a0f; --surface:#0d1117; --surface2:#161b22; --border:#30363d;
@@ -87,7 +87,7 @@
 <body>

 <header>
-  <div class="logo"><div class="icon">◈</div><span>metona-sqlark</span></div>
+  <div class="logo"><div class="icon">◈</div><span>MetonaSqlark</span></div>
  <nav>
    <a href="index.html">首页</a>
    <a href="docs.html">文档</a>
@@ -104,7 +104,7 @@
      <div class="tab" data-tab="builder">Query Builder</div>
    </div>
    <div class="editor-area">
-      <textarea id="sql-input" placeholder="输入 SQL 语句...&#10;&#10;SELECT * FROM users WHERE age > 18&#10;INSERT INTO users VALUES ('4', 'Diana', 'diana@test.com', 28)&#10;SELECT u.name, o.amount FROM users u INNER JOIN orders o ON u.id = o.user_id">-- 欢迎使用 metona-sqlark 在线演示 🚀
+      <textarea id="sql-input" placeholder="输入 SQL 语句...&#10;&#10;SELECT * FROM users WHERE age > 18&#10;INSERT INTO users VALUES ('4', 'Diana', 'diana@test.com', 28)&#10;SELECT u.name, o.amount FROM users u INNER JOIN orders o ON u.id = o.user_id">-- 欢迎使用 MetonaSqlark 在线演示 🚀
 -- 已预置 users / orders 表数据，试试以下查询：

 SELECT * FROM users;
@@ -335,7 +335,7 @@ document.querySelectorAll('.tab').forEach(tab => {

 // Boot
 initDB().then(() => {
-  console.log('✅ metona-sqlark demo ready');
+  console.log('✅ MetonaSqlark demo ready');
  // Auto-run initial query
  setTimeout(runQuery, 200);
 });
@@ -3,7 +3,7 @@
 <head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>API 文档 — metona-sqlark</title>
+<title>API 文档 — MetonaSqlark</title>
 <style>
  :root {
    --bg:#0a0a0f; --surface:#14141f; --surface2:#1a1a2e; --border:#2a2a45;
@@ -67,7 +67,7 @@

 <header>
  <div class="inner">
-    <div class="logo"><div class="icon">◈</div><span>metona-sqlark</span></div>
+    <div class="logo"><div class="icon">◈</div><span>MetonaSqlark</span></div>
    <nav>
      <a href="index.html">首页</a>
      <a href="docs.html" class="nav-active">文档</a>
@@ -102,10 +102,10 @@

 <h2 id="install">📦 安装</h2>
 <pre><span class="c">// npm</span>
-npm install @metona-team/metona-sqlark
+npm install @metona-team/MetonaSqlark

 <span class="c">// ESM</span>
-<span class="k">import</span> { MetonaSqlark, MeSqlark } <span class="k">from</span> <span class="s">'metona-sqlark'</span>;
+<span class="k">import</span> { MetonaSqlark, MeSqlark } <span class="k">from</span> <span class="s">'MetonaSqlark'</span>;

 <span class="c">// Browser</span>
 &lt;script src=<span class="s">"metona-sqlark.min.js"</span>&gt;&lt;/script&gt;
@@ -273,7 +273,7 @@ db.<span class="f">on</span>(<span class="s">'afterQuery'</span>, <span class="k
 <span class="k">await</span> users.<span class="f">insert</span>({ <span class="s">id</span>: <span class="s">'1'</span>, <span class="s">name</span>: <span class="s">'Alice'</span>, <span class="s">age</span>: <span class="n">30</span> }); <span class="c">// ✅ 类型安全</span></pre>

 <h2 id="config">⚙️ 配置项</h2>
-<pre><span class="k">import</span> { MetonaSqlark, MeSqlark } <span class="k">from</span> <span class="s">'metona-sqlark'</span>;
+<pre><span class="k">import</span> { MetonaSqlark, MeSqlark } <span class="k">from</span> <span class="s">'MetonaSqlark'</span>;
 <span class="c">// MeSqlark 是 MetonaSqlark 的别名，完全等价</span></pre>

  </main>
@@ -3,7 +3,7 @@
 <head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>metona-sqlark — 前端 TypeScript 数据库</title>
+<title>MetonaSqlark — 前端 TypeScript 数据库</title>
 <style>
  :root {
    --bg: #0a0a0f;
@@ -136,13 +136,13 @@
  <div class="container">
    <div class="logo">
      <div class="icon">◈</div>
-      <span>metona-sqlark</span>
+      <span>MetonaSqlark</span>
    </div>
    <nav>
      <a href="index.html">首页</a>
      <a href="docs.html">文档</a>
      <a href="demo.html">演示</a>
-      <a href="https://git.metona.cn/MetonaTeam/metona-sqlark" target="_blank">GitHub</a>
+      <a href="https://git.metona.cn/MetonaTeam/MetonaSqlark" target="_blank">GitHub</a>
    </nav>
    <a href="demo.html" class="btn btn-primary">立即体验</a>
  </div>
@@ -161,11 +161,71 @@
  </div>
 </section>

+<!-- Install -->
+<section style="padding:20px 0 60px;">
+  <div class="container">
+    <div class="section-title">
+      <h2>📦 <span>安装</span>引入</h2>
+      <p>多种方式，按需选择</p>
+    </div>
+    <div class="feature-grid">
+      <div class="feature-card">
+        <div class="icon">📦</div>
+        <h3>npm (Gitea Registry)</h3>
+        <div class="code-block" style="font-size:0.8rem;margin-top:12px;padding:14px;">
+<span class="comment"># 配置 registry</span>
+npm config set @metona-team:registry https://git.metona.cn/api/packages/MetonaTeam/npm/
+
+<span class="comment"># 安装</span>
+npm install @metona-team/metona-sqlark
+        </div>
+      </div>
+      <div class="feature-card">
+        <div class="icon">🌐</div>
+        <h3>CDN / Browser UMD</h3>
+        <div class="code-block" style="font-size:0.8rem;margin-top:12px;padding:14px;">
+<span class="comment">&lt;!-- 直接引用 dist 产物 --&gt;</span>
+&lt;<span class="keyword">script</span> src=<span class="string">"metona-sqlark.min.js"</span>&gt;&lt;/script&gt;
+&lt;<span class="keyword">script</span>&gt;
+  <span class="keyword">const</span> db = <span class="keyword">await</span> window.<span class="func">MetonaSqlark</span>.create({...});
+  <span class="comment">// 或 window.MeSqlark（别名）</span>
+&lt;/script&gt;
+        </div>
+      </div>
+      <div class="feature-card">
+        <div class="icon">⚡</div>
+        <h3>ESM / TypeScript</h3>
+        <div class="code-block" style="font-size:0.8rem;margin-top:12px;padding:14px;">
+<span class="keyword">import</span> { MetonaSqlark, MeSqlark }
+  <span class="keyword">from</span> <span class="string">'@metona-team/metona-sqlark'</span>;
+
+<span class="keyword">const</span> db = <span class="keyword">await</span> <span class="func">MetonaSqlark</span>.create({
+  <span class="string">name</span>: <span class="string">'my-app'</span>,
+  <span class="string">mode</span>: <span class="string">'hybrid'</span>,
+});
+        </div>
+      </div>
+      <div class="feature-card">
+        <div class="icon">🔧</div>
+        <h3>CommonJS</h3>
+        <div class="code-block" style="font-size:0.8rem;margin-top:12px;padding:14px;">
+<span class="keyword">const</span> { MetonaSqlark } =
+  <span class="func">require</span>(<span class="string">'@metona-team/metona-sqlark'</span>);
+
+(<span class="keyword">async</span> () => {
+  <span class="keyword">const</span> db = <span class="keyword">await</span> <span class="func">MetonaSqlark</span>.create({...});
+})();
+        </div>
+      </div>
+    </div>
+  </div>
+</section>
+
 <!-- Features -->
 <section>
  <div class="container">
    <div class="section-title">
-      <h2>为什么选择 <span>metona-sqlark</span></h2>
+      <h2>为什么选择 <span>MetonaSqlark</span></h2>
      <p>专为前端打造的数据库引擎</p>
    </div>
    <div class="feature-grid">
@@ -238,7 +298,7 @@
  <div class="container">
    <div class="section-title">
      <h2>用<span>数字</span>说话</h2>
-      <p>metona-sqlark 的核心指标</p>
+      <p>MetonaSqlark 的核心指标</p>
    </div>
    <div class="stats">
      <div class="stat-card"><div class="num">235+</div><div class="label">测试用例</div></div>
@@ -251,7 +311,7 @@

 <footer>
  <div class="container">
-    <p>© 2026 <a href="https://git.metona.cn/MetonaTeam/metona-sqlark">MetonaTeam</a>. MIT License. Built with TypeScript.</p>
+    <p>© 2026 <a href="https://git.metona.cn/MetonaTeam/MetonaSqlark">MetonaTeam</a>. MIT License. Built with TypeScript.</p>
  </div>
 </footer>