安裝
建立 Text.js 應用程式、開啟 DevTools 並設定主控台。
系統需求
- Bun 1.2+ 或 Node.js 22+
- 桌面版 Chrome、Edge、Firefox 或 Safari
建立應用程式
bunx create-text-app@latest選擇範本（starter、dashboard 或 opencode），然後啟動開發伺服器：
cd my-appbun installbun dev開啟主控台
前往 http://localhost:3000 並開啟主控台。
| 瀏覽器 | macOS | Windows / Linux |
|---|---|---|
| Chrome、Edge、Arc、Brave | ⌘ ⌥ J | Ctrl Shift J |
| Firefox | ⌘ ⌥ K | Ctrl Shift K |
| Safari | ⌘ ⌥ C | 僅限 macOS |
在 Safari 中，先到「設定」→「進階」開啟 「顯示網頁開發者功能」。
點一下頁面使其取得焦點，然後輸入。將 DevTools 停駐在底部可取得最寬的網格。
主控台設定
在主控台設定中關閉 「保留記錄」。Text.js 每個影格附加一則訊息，並清除主控台以釋放舊影格。開啟「保留記錄」時，DevTools 會忽略清除操作，舊影格便會累積。
手動設定
bun add @textjs/app react react-dompackage.jsonjson
{ "scripts": { "dev": "text dev", "build": "text build", "start": "text start" }}app/page.tsxtsx
import { Text } from "@textjs/app";export default function Page() { return <Text className="p-1">Hello from console.log</Text>;}不使用框架
從現有網站將任意 React 樹掛載到主控台：
main.tsxtsx
import { renderToConsole, Box, Text } from "@textjs/react";await renderToConsole( <Box className="border rounded p-1"> <Text bold>Hello, DevTools</Text> </Box>, { width: 100, height: 32 },);