lobehub/lobe-tts

Lobe TTS – JavaScript/TypeScript 向けテキスト読み上げと音声認識

これは何か

• テキストを音声に変換し、音声をテキストに書き起こすことができる、小さな純 JavaScript ライブラリ（@lobehub/tts）です。
• サーバー（Node.js / Bun）とブラウザの両方で動作し、すぐに統合できる既製の React フックと UI コンポーネントが付属しています。

なぜ使うのか

• 統一 API – 同じ関数呼び出しが複数のプロバイダー（Microsoft Edge、Microsoft Speech、OpenAI、またはブラウザの組み込み音声合成）で動作します。アプリコードを変更せずにバックエンドを切り替えることができます。
• サーバーサイド生成 – バックエンドで MP3 ファイルを作成し、クライアントに配信できます。事前レンダリングされたポッドキャスト、音声通知、アクセシビリティ機能に役立ちます。
• クライアントサイド再生 – React アプリで即座に音声を再生でき、内蔵の <AudioPlayer> が進行状況を表示し、一時停止を許可し、ダウンロードボタンを提供します。
• 長文処理 – ライブラリは音声をストリーミングするため、長い文章はファイル全体が準備できる前に再生が始まり、よりスムーズな UX を提供します。
• AI フレンドリーなドキュメント – skills.md と llms.txt ファイルを公開しているため、AI コーディングアシスタント（Claude、Cursor、Copilot など）が API を読み取り、コードを自動生成できます。

始め方

# コアパッケージをインストール（ESM のみ）
pnpm i @lobehub/tts

• React の場合は、@lobehub/ui、react@^19、react-dom@^19 も必要です。

サーバーサイドの例（Bun / Node 22+）

import { EdgeSpeechTTS } from '@lobehub/tts';
import fs from 'node:fs';

const tts = new EdgeSpeechTTS({ locale: 'en-US' });
const response = await tts.create({
  input: 'This is a speech demonstration',
  options: { voice: 'en-US-GuyNeural' }
});
fs.writeFileSync('./speech.mp3', Buffer.from(await response.arrayBuffer()));

（古い Node で実行する場合は、グローバルな WebSocket 実装を提供してください。）

React の使用法

import { AudioPlayer, useEdgeSpeech } from '@lobehub/tts/react';
import { Button, Flexbox } from '@lobehub/ui';

export default function Demo() {
  const { isGlobalLoading, start, stop, audio } = useEdgeSpeech('Hello from Lobe TTS', {
    options: { voice: 'en-US-GuyNeural' }
  });
  return (
    <Flexbox gap={8}>
      <Button loading={isGlobalLoading} ? stop : start}>
        Speak
      </Button>
      <AudioPlayer audio={audio} isLoading={isGlobalLoading} />
    </Flexbox>
  );
}

必要に応じて、Next.js 設定に transpilePackages: ['@lobehub/tts'] を追加します。

パッケージ構成

パッケージ	目的
@lobehub/tts	コア API – 音声生成または音声書き起こし。任意の JS 環境で使用可能。
@lobehub/tts/server	独自の API ルートを介して OpenAI 音声/書き起こしをプロキシするためのヘルパー。
@lobehub/tts/react	React フック（useEdgeSpeech、useOpenAISpeech など）と <AudioPlayer> コンポーネント。

ドキュメントとコミュニティ

• 完全なドキュメント、ライブデモ、API リファレンスは tts.lobehub.com にあります。
• このプロジェクトはオープンソース（MIT）であり、GitHub Issues と Pull Requests を通じて貢献を歓迎します。
• OpenCollective を通じてスポンサーになることができます。

誰が恩恵を受けるか

• 音声フィードバックや音声コマンドを必要とする Web アプリを構築するフロントエンド開発者。
• オンデマンドで音声ファイルを生成する必要があるバックエンドサービス（例：自動アナウンス、アクセシビリティツール）。
• すでに Lobe の UI コンポーネントライブラリを使用しており、一貫性のあるプラグアンドプレイの音声ソリューションを望むチーム。

---

上記の詳細はすべてリポジトリの README から直接取得したものであり、追加の機能は推測されていません。