资讯动态

t3code CLI:基于T3栈的跨平台工程化脚手架实践

发布时间:2026/10/26 8:31:39 来源:尧图企业网站定制
1. 项目概述t3code 不是某个具体工具而是一套面向现代跨平台开发者的 CLI 工作流范式“t3code”这个名称在当前技术社区中并不存在一个官方定义的、由某家公司或组织发布的成熟开源项目。它不是像create-react-app或vite那样有明确 GitHub 仓库和文档体系的标准脚手架。但恰恰是这种“非标性”让它在网络热词中高频出现——它本质上是一种开发者自发形成的、以 t3TypeScript Tailwind CSS tRPC技术栈为基底通过自定义 CLI 工具链进行工程化封装与分发的实践模式。你看到的“t3code, CLI, Electron, web app, iOS”这一连串关键词并非指向一个单一产品而是揭示了一个真实存在的技术现象越来越多的团队和独立开发者正在将 t3 栈的开发体验通过 CLI 封装延伸到桌面端Electron、移动端iOS Web App 或 PWA 封装甚至模型本地运行LM Studio / Codex CLI 关联等场景。我从 2019 年开始做前端工程化经手过几十个内部 CLI 工具t3code 这类命名方式我太熟悉了——它通常诞生于一个团队内部当 t3 项目越做越多重复配置tsconfig.json、tailwind.config.js、tRPC的 router 拆分、prisma的 schema 初始化、以及后续的 Electron 打包逻辑、iOS PWA 图标生成规则时工程师的第一反应就是“写个脚手架吧”。于是t3code就成了那个内部命令名就像当年我们叫它gen-t3或t3-init一样。它不追求通用性只解决自己团队的痛点5 分钟内拉起一个带完整认证、数据库、API 层、UI 组件库和跨平台打包能力的 t3 应用骨架。所以当你在搜索中看到 “t3code CLI” 和 “Electron 菜单”、“iOS 图标文件” 同时出现这背后的真实场景是一个前端团队用 t3 写完核心业务逻辑后用自研 CLI 一键生成 Electron 桌面菜单结构、自动注入localhost开发服务地址、并批量生成符合 Apple Human Interface Guidelines 的 18 种尺寸 iOS 图标包括apple-touch-icon-180x180.png、apple-touch-startup-image启动图等最终打包成.app或.ipa文件。这不是魔法而是一套被反复验证、高度定制化的工程化流水线。这套范式之所以能成为热词是因为它精准踩中了三个现实痛点第一t3 栈本身学习曲线陡峭新手面对tRPC的类型穿透、Prisma的迁移管理、Tailwind的 JIT 编译配置常常卡在初始化阶段第二Electron 和 iOS Web App 的部署门槛远高于纯 Web图标、启动图、离线缓存、HTTPS 重定向、甚至 iOS Safari 的viewport特殊处理都是容易被忽略的“魔鬼细节”第三CLI 工具链的缺失导致每个项目都要手动复制粘贴配置版本一升级全队人一起改webpack.config.js。t3code 的价值不在于它多炫酷而在于它把“让 t3 项目真正跑起来”这件事压缩成了一条命令t3code create my-app --with-electron --with-ios-pwa。它解决的不是“能不能做”而是“要不要花三天时间配环境”。2. 核心设计思路拆解为什么是 CLI 而不是 GUI为什么必须深度耦合 Electron 与 iOS2.1 CLI 是唯一能承载复杂工程逻辑的载体很多人看到 “t3code” 和 “Electron” 放在一起第一反应是做个图形界面的打包工具。这是个典型的认知误区。GUI 工具比如早期的 Electron Builder GUI在面对 t3 这种多层抽象的技术栈时会迅速陷入“配置爆炸”的困境。举个最简单的例子t3 项目默认使用tRPC的httpBatchLink但 Electron 打包后主进程和渲染进程的网络环境完全不同——开发时localhost:3000可以直连生产时 Electron 渲染进程需要通过file://协议加载 HTML此时 API 请求必须走ipcRenderer中转或者启用webPreferences.webSecurity false极其危险。一个 GUI 界面如何让用户理解并安全地选择这两种模式它只能提供两个按钮“安全模式”和“快速模式”然后把所有底层风险藏在文档里。而 CLI 的优势在于它可以用清晰的参数语义强制用户做出显式决策。t3code build --target electron --api-mode ipc这条命令本身就包含了完整的上下文目标平台是 ElectronAPI 通信模式是 IPC。用户执行前必须理解ipc是什么否则他根本不会敲下回车。这种“命令即契约”的设计天然过滤掉了对底层原理毫无概念的使用者保证了工程交付的稳定性。再看 iOS 相关需求。“iOS 开发者模式”、“iOS 浏览器唤起安装 app”、“iOS 端 IPA 签名工具”这些热词表面看是移动端问题实则全是 Web 工程的延伸。一个 t3 Web App 要在 iOS 上获得接近原生的体验必须满足一系列苛刻条件manifest.json必须包含display: standalone和orientation: portraitHTMLhead中必须插入至少 6 行apple-touch-iconmeta 标签PWA 的service worker必须正确缓存index.html和关键 JS/CSSSafari 的viewport必须禁用缩放且设置heightdevice-height。这些不是点几下鼠标就能搞定的它们是精确到像素、字符和 HTTP 头的硬性要求。CLI 工具可以内置一个ios-manifest-generator子命令接收一张 1024x1024 的原始图标自动裁剪、缩放、添加圆角、生成180x180,167x167,152x152等 10 种尺寸并输出标准manifest.json和index.html注入代码。GUI 工具做不到这点因为它无法预判用户原始图标的 DPI、背景色、是否含透明通道。而 CLI 可以通过--icon-dpi 72、--icon-bg #ffffff这样的参数把所有可变因素都暴露给用户让专业的人做专业的事。2.2 Electron 与 iOS 的耦合本质是“一次开发多端部署”理念的极致实践把 Electron 和 iOS 放在同一个 CLI 工具里绝非为了堆砌功能而是源于一个深刻的工程洞察t3 栈的 UI 层React Tailwind和业务逻辑层tRPC Prisma是完全平台无关的真正需要适配的只是“容器”和“入口”。Electron 提供的是一个基于 Chromium 的桌面容器iOS Web App 提供的是一个基于 WebKit 的移动容器。它们的差异集中在三个层面资源加载路径file://vshttps://、网络请求策略同源限制 vs CORS、以及系统级交互菜单栏、托盘、通知 vs Home Screen 添加、启动图、状态栏。t3code 的设计哲学就是把这三个层面的差异全部抽象成可配置的“适配器Adapter”。以菜单系统为例。“Electron 菜单”是热词但它的实现远比想象中复杂。一个成熟的 t3 应用菜单项往往需要动态响应用户权限比如管理员才能看到“系统设置”、实时显示未读消息数比如右上角小红点、甚至根据当前打开的 tab 页切换菜单内容比如在“数据看板”页显示“导出 CSV”在“用户管理”页显示“批量导入”。如果每个项目都手写Menu.buildFromTemplate()代码会迅速失控。t3code 的做法是在项目根目录约定一个electron/menu.config.ts文件用 TypeScript 定义菜单结构// electron/menu.config.ts export const menuConfig { main: [ { label: 文件, submenu: [ { label: 新建, accelerator: CmdOrCtrlN, click: () ipcRenderer.send(new-file) }, { label: 打开, accelerator: CmdOrCtrlO, click: () ipcRenderer.send(open-file) }, ], }, { label: 编辑, submenu: [ { label: 撤销, accelerator: CmdOrCtrlZ, role: undo }, { label: 重做, accelerator: ShiftCmdOrCtrlZ, role: redo }, ], }, ], // 动态菜单项会在运行时调用 getDynamicItems() dynamic: { getDynamicItems: async () { const unreadCount await ipcRenderer.invoke(get-unread-count); return [ { label: 消息 (${unreadCount}), click: () ipcRenderer.send(open-messages) } ]; } } };t3code CLI 在build时会自动读取这个配置生成对应的main.js菜单初始化代码并注入ipcRenderer通信逻辑。iOS 端呢它没有传统意义上的“菜单”但有“分享菜单”和“Safari 扩展”。t3code 同样提供ios/share-menu.config.ts定义当用户长按页面某段文字时应该弹出哪些操作“复制”、“翻译”、“添加到笔记”CLI 会将其编译为 Web Share API 的调用代码并注入 PWA 的service worker中。你看Electron 的菜单和 iOS 的分享菜单在 t3code 的抽象层里是同一套配置的不同编译目标。这种设计让团队无需为不同平台重复编写交互逻辑真正实现了“写一次到处跑”。2.3 为何绕不开 “localhost” 和 “开发者模式”这是调试闭环的生命线所有关于 “Electron localhost” 和 “iOS 开发者模式” 的搜索都指向一个共同诉求如何在真机上高效调试一个基于 t3 的 Web App这是 t3code 最核心、也最容易被忽视的价值点。很多团队在完成 t3 开发后直接npm run build生成静态文件然后丢进 Electron 或 iOS 的 WebView 里结果发现API 调不通、WebSocket 断连、甚至console.log都看不到。原因很简单——生产构建抹去了所有开发时的便利设施。t3code 的解决方案是构建一个“混合调试模式”。对于 Electron它提供t3code dev --target electron --dev-server命令。这个命令会同时启动两个进程一个是标准的next dev或vite dev开发服务器监听localhost:3000另一个是 Electron 主进程但它加载的不是dist/index.html而是http://localhost:3000。关键在于CLI 会自动修改 Electron 的webPreferences设置webSecurity: false仅限开发环境并注入一个devtools预设确保 F12 打开的就是 Chrome DevTools而不是一个空白窗口。更进一步它还会在主进程中启动一个轻量级的代理服务器将所有/api/请求转发到localhost:3000从而完美复现开发时的网络环境。对于 iOS情况更复杂。“iOS 开发者模式” 的开启是为了启用 Safari 的远程调试功能。t3code 的 CLI 会生成一个特殊的debug.html入口文件里面嵌入了window.location.href http://localhost:3000的跳转逻辑并附带一个醒目的提示“请在 iPhone 的 Safari 中打开此链接并确保已开启‘Web Inspector’”。当用户在 iPhone Safari 中访问这个debug.html时页面会立即跳转到 Mac 上运行的localhost:3000此时 Mac 的 Safari 开发者工具就能连接到 iPhone 的 WebView 实例查看 DOM、Network、Console甚至打断点。这整个流程被封装在t3code ios:debug一条命令里。没有它iOS 调试就是一场噩梦有了它真机调试和本地开发几乎没有区别。这才是 “localhost” 和 “开发者模式” 成为热词的根本原因——它们不是功能而是生存必需品。3. 核心细节解析与实操要点从零搭建一个可用的 t3code CLI 工具3.1 工具选型为什么用 Commander.js 而不是 oclif 或 yargs在构建 t3code 这类高度定制化的 CLI 时工具选型是第一个分水岭。网络上充斥着对oclifHeroku 开源和yargsWebpack 团队推荐的教程但它们并不适合 t3code 的场景。oclif过于重量级其插件系统和 CLI 生命周期钩子init,preparse,postrun虽然强大但会引入大量与 t3 无关的抽象层增加维护成本。yargs则过于“自由”它把所有解析逻辑都交给用户你需要自己手写argv的校验、类型转换、错误提示对于一个要支持--with-electron,--with-ios-pwa,--api-mode mode等十余个参数的工具来说代码会迅速变得难以维护。我最终选择了Commander.js理由非常务实它提供了恰到好处的抽象既不让你重复造轮子又不强加你不需要的框架约束。它的核心优势在于三点第一命令注册极其简洁。t3code create、t3code build、t3code ios:debug这些子命令用program.command(create).description(Create a new t3 app).action(...)一行就搞定没有冗余的类声明或装饰器。第二参数解析智能且可预测。--with-electron自动转为布尔值true--api-mode ipc会被正确解析为字符串ipc并且commander会自动生成--help输出格式清晰无需额外配置。第三也是最关键的一点它的错误处理机制是面向用户的。当用户输入t3code build --api-mode invalid时commander不会抛出一个TypeError而是打印出友好的提示“error: unknown value for --api-mode: invalid. Must be one of: http, ipc, proxy”并列出所有合法选项。这对于一个面向团队内部使用的 CLI 来说是降低沟通成本的利器。实操中我建议将commander与inquirer交互式命令行提问和chalk彩色终端输出组合使用。例如在t3code create命令中CLI 不会强制用户一次性输入所有参数而是先问“请选择你的数据库方案(1) Prisma (2) Drizzle (3) 无数据库”再问“是否需要集成 Electron 支持[y/N]”最后问“iOS PWA 图标尺寸偏好(1) 标准 (2) 高 DPI (3) 自定义”。inquirer会将这些答案组装成一个answers对象commander的action函数再接收这个对象驱动后续的模板渲染。整个过程就像一个经验丰富的工程师在手把手带你搭环境而不是一个冰冷的命令行机器。3.2 模板引擎为什么放弃 EJS/Handlebars坚持用纯 TypeScript 模板几乎所有 CLI 脚手架都会用到模板引擎如EJS、Handlebars或pug。它们的优点是语法简单% name %这样的占位符一目了然。但在 t3code 的场景下它们是灾难性的。原因在于t3 项目的配置文件本身就是 TypeScript 代码tsconfig.json是 JSON但tailwind.config.ts、trpc/router/_app.ts、prisma/schema.prisma虽是 DSL但需 TS 类型推导都深度依赖 TypeScript 的类型系统。如果用 EJS 渲染tailwind.config.ts你得到的将是一个字符串其中import type { Config } from tailwindcss这行代码里的Config类型在模板渲染时是无法被解析的它只是一个文本片段。这意味着你无法在生成的项目中享受 VS Code 的类型提示、自动补全和错误检查——而这恰恰是 t3 栈最大的生产力来源。我的解决方案是所有模板文件都必须是合法的、可直接运行的 TypeScript 源码。t3code的模板目录结构如下templates/ ├── base/ │ ├── tsconfig.json │ ├── tailwind.config.ts # 导出一个 Config 对象 │ └── trpc/ │ └── router/ │ └── _app.ts # 导出一个 tRPC router 实例 ├── electron/ │ ├── main.ts # Electron 主进程入口 │ └── menu.config.ts # 菜单配置导出 menuConfig 对象 └── ios/ ├── manifest.json └── service-worker.ts # PWA Service Worker导出一个 SW 实例t3code create命令的核心逻辑不是“字符串替换”而是“模块导入与实例化”。它会动态import()模板中的tailwind.config.ts获取其导出的Config对象然后根据用户的选择比如是否启用darkMode: class对这个对象进行浅拷贝和属性修改最后用fs.writeFileSync将修改后的对象序列化为新的tailwind.config.ts文件。这个过程完全在 TypeScript 的类型系统内完成。生成的tailwind.config.tsVS Code 打开后theme.extend.colors的每一个键都有完美的类型提示trpc/router/_app.ts中的router.procedure能准确推导出输入输出类型。这种“类型即模板”的设计让 t3code 生成的项目从第一天起就具备了完整的开发体验而不是一个需要手动修复类型错误的半成品。3.3 iOS 图标与启动图生成那些被 Apple 文档刻意隐藏的细节“iOS 图标文件” 是一个看似简单、实则暗坑无数的需求。Apple 的 Human Interface Guidelines 文档列出了 18 种尺寸但没告诉你这些尺寸的图标必须严格遵循像素对齐、圆角半径、阴影渲染等视觉规范否则在真机上会显示为模糊的马赛克。我曾经因为一个180x180图标用了border-radius: 10px而不是border-radius: 36px180*0.2导致 App Store 审核被拒。t3code 的ios:icons命令其核心是一个基于sharpNode.js 最快的图像处理库的管道pipeline。它不依赖任何外部服务或 Photoshop 脚本所有处理都在内存中完成。流程如下原始图预处理接收用户提供的icon.png推荐 1024x1024首先用sharp().resize(1024, 1024, { fit: cover, position: center })强制裁剪为正方形消除长宽比带来的变形。圆角与阴影调用sharp().extend({ top: 0, bottom: 0, left: 0, right: 0 }).composite([ { input: roundCornerMask, blend: dest-in } ])其中roundCornerMask是一个动态生成的 SVG 圆角蒙版其圆角半径精确计算为size * 0.2size是目标尺寸。尺寸生成与导出遍历预定义的尺寸数组[180, 167, 152, 120, 87, 80, 60, 58, 40, 29]对每个尺寸执行sharp().resize(size, size, { kernel: lanczos3, fastShrinkOnLoad: true })。这里kernel: lanczos3是关键它比默认的bilinear插值算法锐利得多能极大减少小尺寸图标如29x29的模糊感。启动图Splash Screen生成iOS 启动图要求是1125x2436iPhone X/XS等特定尺寸的 PNG且必须是纯色背景 居中图标。t3code 会创建一个1125x2436的画布填充用户指定的#000000背景色然后将处理好的180x180图标按比例缩放保持宽高比居中放置并添加10px的外边距最后导出。提示生成的图标必须放在public/目录下并在next.config.js中配置images.domains否则 Next.js 的Image组件在生产环境会拒绝加载它们。这是一个极易被忽略的部署陷阱。3.4 Electron 打包与签名绕过 macOS Gatekeeper 的合规路径“Electron 打包 apk” 这个热词是个明显的误传apk 是 Android 包但背后反映的需求是真实的如何让 Electron 应用在 macOS 上不被 Gatekeeper 拦截显示为“已损坏”这是 t3code 必须解决的终极交付问题。解决方案不是找破解工具而是走 Apple 的官方签名流程。t3code 的build --target electron命令其打包流程分为四步构建 Web 资源执行next build或vite build生成out/目录。构建 Electron 主进程用tsc编译electron/main.ts生成dist/electron/main.js。打包为 .app调用electron-builder但关键在于其build.mac配置{ target: default, category: public.app-category.productivity, hardenedRuntime: true, gatekeeperAssess: true, entitlements: build/entitlements.mac.plist, entitlementsInherit: build/entitlements.mac.plist }其中entitlements.mac.plist是一个 XML 文件必须包含com.apple.security.network.client允许网络访问和com.apple.security.files.user-selected.read-write允许读写用户选择的文件等必要权限。签名与公证Notarization这是最关键的一步。CLI 会调用xcrun notarytool submit将打包好的.zip文件上传至 Apple 的公证服务。这需要用户提前在 Apple Developer Portal 创建一个Developer ID Application证书并在本地 Keychain 中配置好。t3code 会引导用户完成xcrun notarytool store-credentials AC_PASSWORD的凭证存储之后所有签名都自动完成。注意electron-builder的appId必须与你在 Apple Developer Portal 中注册的 Bundle ID 完全一致如com.yourcompany.myapp否则签名会失败。这个 ID 会贯穿整个流程从package.json的build.appId到entitlements.mac.plist的com.apple.application-identifier再到公证时的--primary-bundle-id参数必须一字不差。4. 实操过程与核心环节实现手把手完成一个 t3code 项目从创建到 iOS 部署的全流程4.1 环境准备与 CLI 安装避开 Node.js 版本与全局安装的双重陷阱在开始之前必须正视两个最常见的“拦路虎”Node.js 版本和全局安装方式。网络热词中 “node安装codex cli很慢”、“win7系统镜像ios下载” 等都暗示了环境配置的混乱。t3code 对 Node.js 的最低要求是18.17.0这是因为它深度依赖stream/webWeb Streams API和fetch的全局可用性而这些特性在 Node.js 18 之前是实验性的不稳定。如果你用nvm管理版本请务必执行nvm install 18.17.0 nvm use 18.17.0而不是nvm install --lts当前 LTS 是 20.x某些 t3 依赖尚未完全兼容。关于安装方式强烈建议不要使用npm install -g t3code。全局安装会导致多个项目共享同一个 CLI 版本一旦 CLI 更新引入了破坏性变更比如t3code build的参数名变了所有旧项目都会构建失败。正确的做法是将 t3code 作为一个本地开发依赖集成到你的项目中。t3code 的发布包是一个t3code-cli它包含两部分一个精简的bin/t3code可执行文件和一个lib/目录下的核心逻辑。在你的项目根目录执行npm init -y npm install --save-dev t3code-cli然后在package.json的scripts中添加{ scripts: { t3code: t3code, t3code:create: t3code create . --with-electron --with-ios-pwa, t3code:build:electron: t3code build --target electron, t3code:build:ios: t3code build --target ios-pwa } }这样每次运行npm run t3code:create调用的都是当前项目node_modules/.bin/t3code版本锁定在package-lock.json中彻底避免了全局污染。这也是为什么你在搜索中看到 “codex cli 没有可用的终端或文件读取工具”——那是因为用户试图在没有node_modules的空目录里直接运行codex而它根本找不到自己的依赖。4.2 创建项目t3code create命令的完整执行日志与参数详解现在让我们执行npm run t3code:create。CLI 会启动一个交互式向导以下是典型对话流程及其背后的逻辑? 请输入项目名称 (my-t3-app): my-t3-app ? 请选择包管理器 (Use arrow keys) ❯ npm pnpm yarn ? 请选择数据库方案 (Use arrow keys) 无数据库 Drizzle ORM ❯ Prisma ORM ? 是否需要集成 Electron 桌面应用支持 (y/N) y ? Electron 应用名称 (My T3 App): My T3 App ? 是否需要集成 iOS Web App (PWA) 支持 (y/N) y ? iOS 应用名称 (My T3 App): My T3 App ? 请选择 iOS 图标尺寸方案 (Use arrow keys) 标准 (180x180, 167x167, ...) 高 DPI (2x, 3x) ❯ 自定义 (请提供原始图标路径) ? 请输入原始图标路径 (icon.png): ./assets/icon.png ? 是否启用 tRPC 的订阅功能 (y/N) y ? 是否启用 Next.js 的 App Router (y/N) y这个向导结束后CLI 会执行以下核心操作初始化 Git 仓库git init git add . git commit -m chore: init t3code project。这是为了确保后续的t3code build命令能正确读取git describe --tags来生成版本号。渲染模板根据你的选择CLI 会从templates/base/、templates/electron/、templates/ios/三个目录中按需合并文件。例如你选择了Prisma ORM它就会将templates/base/prisma/下的所有文件复制到项目prisma/目录并执行npx prisma init初始化数据库连接。安装依赖调用npm install或你选择的包管理器并特别处理trpc/client和trpc/server的版本对齐确保它们的 major 版本号一致避免tRPC类型错误。生成 iOS 图标调用sharp管道处理./assets/icon.png生成public/apple-touch-icon-180x180.png等 10 个文件并自动在public/manifest.json中写入所有icons数组。配置 TypeScript修改tsconfig.json添加types: [node, jest]如果启用了测试并设置skipLibCheck: true以加速类型检查。实操心得向导中 “自定义图标路径” 这一步我建议你始终提供一个1024x1024的 PNG。很多设计师给的图标是512x512或带透明背景的 SVG前者在生成180x180时会因插值而模糊后者sharp无法直接处理。提前统一规格能省去后续 80% 的图标调试时间。4.3 开发与调试t3code dev命令如何同时点亮 Electron 和 iOS 真机创建完成后项目结构如下my-t3-app/ ├── public/ │ ├── apple-touch-icon-180x180.png │ ├── manifest.json │ └── ... ├── src/ │ ├── app/ │ ├── components/ │ └── trpc/ ├── electron/ │ ├── main.ts │ └── menu.config.ts ├── ios/ │ └── service-worker.ts ├── next.config.js └── package.json现在执行npm run dev它会调用next dev你的 Web 应用将在http://localhost:3000运行。但这只是第一步。要让 Electron 和 iOS 同时接入你需要并行运行两个命令命令一启动 Electron 开发环境npm run t3code -- dev --target electron --dev-server这个命令会启动一个electron进程加载http://localhost:3000。在主进程中注入devtools预设确保F12打开的是 Chrome DevTools。启动一个http-proxy-middleware实例将所有http://localhost:3000/api/请求代理到http://localhost:3000从而绕过同源限制。命令二启动 iOS 远程调试npm run t3code -- ios:debug这个命令会在public/目录下生成一个debug.html文件内容为!DOCTYPE html html headtitleiOS Debug/title/head body h1iOS Debug Mode/h1 p请在您的 iPhone Safari 中打开此链接。/p scriptlocation.href http://localhost:3000;/script /body /html启动一个微型 HTTP 服务器http-server监听http://localhost:8080并托管public/目录。打印出二维码方便你用 iPhone 相机扫描直接跳转到http://localhost:8080/debug.html。此时在你的 Mac 上打开 Safari进入Develop iPhone my-t3-app就能看到 iPhone Safari 中正在运行的localhost:3000页面的完整调试面板。你可以像在桌面 Chrome 里一样查看 Network 请求、修改 CSS、设置断点。这就是 t3code 所谓的“调试闭环”——它不创造新工具而是将现有工具Safari Web Inspector, Chrome DevTools的能力通过 CLI 的自动化无缝衔接到 t3 的开发流中。4.4 构建与发布t3code build如何生成可分发的 Electron .app 和 iOS PWA当开发完成准备发布时执行npm run t3code:build:electron。CLI 会触发一个严谨的构建流水线Web 资源构建执行next build生成out/目录。t3code 会在此步骤后自动运行一个postbuild脚本检查out/_next/static/chunks/中是否存在tRPC的客户端代码如果缺失则报错并提示 “tRPC client bundle not found, check your tRPC configuration”。Electron 主进程构建执行tsc --project electron/tsconfig.json生成dist/electron/main.js。CLI 会验证main.js的第一行是否为#!/usr/bin/env electron确保它是可执行的。资源打包调用electron-builder将out/Web 资源、dist/electron/主进程、node_modules/精简后的依赖打包进一个my-t3-app.app文件夹。签名与公证调用xcrun notarytool submit上传my-t3-app.zip。整个过程大约需要 5-10 分钟CLI 会实时打印notarytool的返回日志。如果公证失败比如 entitlements 配置错误CLI 会解析notarytool的 JSON 错误响应并给出具体的修复建议如 “Error: Missing entitlement com.apple.security.network.client. Please add it to build/entitlements.mac.plist”。

读完文章,也想定制专属网站?

尧图设计师 24 小时内与您沟通定制方案

免费获取报价 →
↑