Lit 原生 ESM 无构建开发最佳实践（源稿）

用户提供规范文档全文。用于构建 fmode-code-lit 规则仓库。目标：零编译、零打包、纯原生 JS，基于浏览器原生 ESM + Import Map，复用 npm 原始包托管在内部 FMODE Repose，业务代码直接上传 OBS+CDN，保存刷新即预览。对标新版 Angular（History 干净路由、DI 依赖注入、Signal 细粒度响应式、组件/服务分层、后台多标签，无 Zone.js）。技术底座：原生浏览器 API（Fetch/History/localStorage）+ Lit 官方原生包。

一、整体架构

无构建无打包：不用 rollup/esbuild/vite/webpack，源码浏览器直接执行
依赖统一托管：lit、@lit-labs/* 从 npm 下原始 ESM 原样同步到内部 FMODE Repose，全业务共享
业务资源独立托管：业务源码（index.html、js 组件）部署 OBS+CDN
分层（对标 Angular）：WebComponent(LitElement) 只渲染视图/DOM事件，不写复杂业务逻辑；Service(普通 ESM Class) 存全局状态/接口/业务计算，与 DOM 解耦；共享工具纯 ESM 函数无状态
响应式：@lit-labs/signals（细粒度信号）
DI：@lit-labs/context（组件树注入）
路由：@lit-labs/router History 干净URL（支持微信 OAuth 回调，需 CDN 回退规则）

部署拓扑

FMODE Repose：/npm/lit/v3.x.x/、/npm/@lit-labs/context|signals|router/vx/、/npm/importmap/lit-v3.json（公共 importmap）
OBS+CDN：index.html(入口引入 importmap)、app.js(入口)、/routes/、/components/、/services/、/utils/

运行流程

浏览器打开 → CDN 回退规则返回 /admin/index.html(200非302) → index.html 加载公共 importmap → 加载 app.js → import lit 依赖 → 初始化路由/Store/根组件渲染

二、前置基础设施（硬性）

FMODE Repose：.js 必须 Content-Type: text/javascript；CORS 允许业务域名；开启 HTTP/2/3；依赖按版本目录化
OBS+CDN History 路由：规则1 匹配真实静态资源直接返回；规则2 不存在路径返回 index.html(200，禁 302/301)；index.html head 加 base 标签（子目录部署写）
ImportMap：公共托管 FMODE Repose 全业务复用；business 的 index.html 用