نصب
یک برنامهٔ 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-dom{ "scripts": { "dev": "text dev", "build": "text build", "start": "text start" }}import { Text } from "@textjs/app";export default function Page() { return <Text className="p-1">Hello from console.log</Text>;}بدون فریم‌ورک
هر درخت React را از یک سایت موجود در کنسول سوار کنید:
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 },);