SuperAPI AI 工具集

manifest-frontend

前端与建站

查看项目

更新于 10-16 05:50

技能介绍

Manifest 的前端系统分两层:框架层负责构建与托管,预设扩展提供实际前端代码与约定。框架层位于 manifest/frontend.ts,负责:用 Bun.build() 把 frontend/ 打包到 dist/ 并生成 source map;在 manifest/server.ts 中以 dist/ 作为 API 路由之后的回退,API 路由优先;开发模式下通过 /__dev/reload 的 SSE 端点推送刷新事件。 预设扩展决定实际前端栈,可用 ls extensions/ | grep manifest-frontend 查看已安装项:manifest-frontend-static(HTML + Tailwind + 原生 TS,适合内容站点、仪表盘、简单界面)与 manifest-frontend-reactive(SolidJS + Tailwind,适合交互应用、实时界面与客户端状态)。应读取已装扩展的 EXTENSION.md 获取组件模式、路由与 API 请求等具体指引。 注意 Bun 的打包器不运行 Tailwind 编译器,只内联 @import "tailwindcss" 而不生成工具类。两个预设均使用 bundleCss: false 并在 config/frontend.ts 的 postBuild 中调用 Tailwind CLI。若 Tailwind 类不生效,先检查这两项。 改前端前先读 config/frontend.ts:entryPoint(静态预设为 .ts,响应式预设为 .tsx)、outputDir、sourceMaps(始终为 true)、spaFallback(为 true 时非 API 且非 dist/ 文件的路径返回 index.html,多页站点应设为 false)、devReload。 开发时用 bun --hot index.ts 一条命令完成监听、自动重建与浏览器刷新,无需第二个进程。静态预设中在 frontend/ 添加 .html 与 .ts,SPA 路由需自行处理 window.location.pathname;响应式预设在 frontend/ 添加 .tsx 并在 App.tsx 组合,SolidJS 组件是返回 JSX 的普通函数。静态资源放 frontend/public/,构建时原样复制到 dist/。 生产构建用 NODE_ENV=production bun run build,输出压缩产物与 source map 到 dist/,该目录被 gitignore。调试报错时按打包位置(如 dist/index.js:142:18)读取 .map 回溯到源文件(如 frontend/App.tsx:28),修改源文件而非产物,再重新构建验证。 若用户在静态预设下需要客户端状态管理、动态响应式更新、组件化架构或实时数据绑定,可建议安装响应式预设 manifest-frontend-reactive,具体安装步骤见其 EXTENSION.md。 限制:资料未提供更多预设或平台细节。