refactor(app): centralize UI constants and error handling

build.cjs

@@ -6,12 +6,12 @@ const path = require('path');
 const projectRoot = __dirname;
 const distDir = path.join(projectRoot, 'dist');
 
-const sourceFiles = {
-    html: path.join(projectRoot, 'index.html'),
-    css: path.join(projectRoot, 'styles.css'),
-    i18n: path.join(projectRoot, 'i18n.js'),
-    app: path.join(projectRoot, 'app.js')
-};
+const sourceFiles = {
+    html: path.join(projectRoot, 'index.html'),
+    css: path.join(projectRoot, 'styles.css'),
+    i18n: path.join(projectRoot, 'i18n.js'),
+    app: path.join(projectRoot, 'app.js')
+};
 
 const logoCandidates = ['logo.png', 'logo.jpg', 'logo.jpeg', 'logo.svg', 'logo.webp', 'logo.gif'];
 const logoMimeMap = {
@@ -78,44 +78,63 @@ function getVersion() {
     return 'v0.0.0-dev';
 }
 
-function ensureDistDir() {
-    if (fs.existsSync(distDir)) {
-        fs.rmSync(distDir, { recursive: true, force: true });
-    }
-    fs.mkdirSync(distDir);
-}
-
-const importRegex = /^import\s+.+?from\s+['"](.+?)['"];?$/gm;
-const exportRegex = /^export\s+/gm;
-
-function bundleApp(entryPath) {
-    const visited = new Set();
-
-    function inlineFile(filePath) {
-        let content = readFile(filePath);
-        const dir = path.dirname(filePath);
-
-        content = content.replace(importRegex, (match, specifier) => {
-            const targetPath = path.resolve(dir, specifier);
-            const normalized = path.normalize(targetPath);
-            if (!fs.existsSync(normalized)) {
-                throw new Error(`无法解析模块: ${specifier} (from ${filePath})`);
-            }
-            if (visited.has(normalized)) {
-                return '';
-            }
-            visited.add(normalized);
-            let moduleContent = inlineFile(normalized);
-            moduleContent = moduleContent.replace(exportRegex, '');
-            const relativePath = path.relative(projectRoot, normalized);
-            return `\n// ${relativePath}\n${moduleContent}\n`;
-        });
-
-        return content;
-    }
-
-    return inlineFile(entryPath);
-}
+function ensureDistDir() {
+    if (fs.existsSync(distDir)) {
+        fs.rmSync(distDir, { recursive: true, force: true });
+    }
+    fs.mkdirSync(distDir);
+}
+
+// 匹配各种 import 语句
+const importRegex = /import\s+(?:{[^}]*}|[\w*\s,{}]+)\s+from\s+['"]([^'"]+)['"];?/gm;
+// 匹配 export 关键字（包括 export const, export function, export class, export async function 等）
+const exportRegex = /^export\s+(?=const|let|var|function|class|default|async)/gm;
+// 匹配单独的 export {} 或 export { ... } from '...'
+const exportBraceRegex = /^export\s*{[^}]*}\s*(?:from\s+['"][^'"]+['"];?)?$/gm;
+
+function bundleApp(entryPath) {
+    const visited = new Set();
+    const modules = [];
+
+    function inlineFile(filePath) {
+        let content = readFile(filePath);
+        const dir = path.dirname(filePath);
+
+        // 收集所有 import 语句
+        const imports = [];
+        content = content.replace(importRegex, (match, specifier) => {
+            const targetPath = path.resolve(dir, specifier);
+            const normalized = path.normalize(targetPath);
+            if (!fs.existsSync(normalized)) {
+                throw new Error(`无法解析模块: ${specifier} (from ${filePath})`);
+            }
+            if (!visited.has(normalized)) {
+                visited.add(normalized);
+                imports.push(normalized);
+            }
+            return ''; // 移除 import 语句
+        });
+
+        // 移除 export 关键字
+        content = content.replace(exportRegex, '');
+        content = content.replace(exportBraceRegex, '');
+
+        // 处理依赖的模块
+        for (const importPath of imports) {
+            const moduleContent = inlineFile(importPath);
+            const relativePath = path.relative(projectRoot, importPath);
+            modules.push(`\n// ============ ${relativePath} ============\n${moduleContent}\n`);
+        }
+
+        return content;
+    }
+
+    const mainContent = inlineFile(entryPath);
+
+    // 将所有模块内容组合在一起，模块在前，主文件在后
+    return modules.join('\n') + '\n// ============ Main ============\n' + mainContent;
+}
+
 
 function loadLogoDataUrl() {
     for (const candidate of logoCandidates) {
@@ -142,8 +161,8 @@ function build() {
     let html = readFile(sourceFiles.html);
     const css = escapeForStyle(readFile(sourceFiles.css));
     const i18n = escapeForScript(readFile(sourceFiles.i18n));
-    const bundledApp = bundleApp(sourceFiles.app);
-    const app = escapeForScript(bundledApp);
+    const bundledApp = bundleApp(sourceFiles.app);
+    const app = escapeForScript(bundledApp);
     
     // 获取版本号并替换
     const version = getVersion();
@@ -164,17 +183,17 @@ ${i18n}
 </script>`
     );
 
-    const scriptTagRegex = /<script[^>]*src="app\.js"[^>]*><\/script>/i;
-    if (scriptTagRegex.test(html)) {
-        html = html.replace(
-            scriptTagRegex,
-            `<script>
-${app}
-</script>`
-        );
-    } else {
-        console.warn('未找到 app.js 脚本标签，未内联应用代码。');
-    }
+    const scriptTagRegex = /<script[^>]*src="app\.js"[^>]*><\/script>/i;
+    if (scriptTagRegex.test(html)) {
+        html = html.replace(
+            scriptTagRegex,
+            `<script>
+${app}
+</script>`
+        );
+    } else {
+        console.warn('未找到 app.js 脚本标签，未内联应用代码。');
+    }
 
     const logoDataUrl = loadLogoDataUrl();
     if (logoDataUrl) {