Установка

#Требования

• 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 и откройте консоль.

В 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 },);