@yasuyoshi64

Vue3でVOICEVOX動かしてみる Vue.js (Vue3) からVOICEVOX engineを使ってみます。 こんな感じのシンプルアプリを作ります。 VOICEVOX engine は以下の記事で動かしてます。 VOICEVOXエンジンをDockerコンテナで動かす Vue3プロジェクト作成 Node.js と Vue3 はインストールされているものとして。 > npm create vue@latest Vue.js - The Progressive JavaScript Framework ? Project name: » voicevox-app ■プロジェクト名を入力。 ? Add TypeScript? » No / Yes ■JavaScriptを使用するのでNo。 ? Add JSX Support? » No / Yes ■スクリプトの中にタグを書けるようします。Noで。 ? Add Vue Router for Single Page Application development? » No / Yes ■Vue2にもあったRouterですね、今回はいらないのでNoで。 ? Add Pinia for state management? » No / Yes ■Vue2にあったVuex(store)の代替機能です。状態管理ツール。Noで。 ? Add Vitest for Unit Testing? » No / Yes ■Viteの単体テストフレームワークです。Noで。 ? Add an End-to-End Testing Solution? » - Use arrow-keys. Return to submit. > No ■E2Eテストフレームワークです。Noで。 Cypress Nightwatch Playwright ? Add ESLint for code quality? » No / Yes ■ソース整形/チェック用のESLintですね。Noで。 ? Add Prettier for code formatting? » No / Ye...

VOICEVOXエンジンをDockerコンテナで動かす SSS LLC. 四国めたん VOICEBOX を起動すれば http://localhost:50021 でエンジンのAPIにアクセスできます。 APIのドキュメントは http://localhost:50021/docs で表示されます。 独自アプリなんかで利用したい場合はエディタの部分は不要なのでエンジンだけDockerで起動できるようにしてみます。 VOICEBOXのエンジンはPython + FastAPI、オープンソースでGithubに公開されてます。 VOICEBOX ENGINE なのですがDockerイメージ( voicevox/voicevox_engine )が既に公式から公開されているのでそちらを使って動かします。 compose.yml を作ります。CPU版とGPU版がありますが今回はCPU版にしました。 version : '3.4' services : voicevox_engine : image : voicevox/voicevox_engine : cpu - ubuntu20.04 - latest container_name : voicevox_engine ports : - 50021 : 50021 動かします。 > docker-compose up http://localhost:50021/docs にアクセスすると動いてますね。 音声ファイルを生成してみます。 curlコマンドはWindowsだとちょっと面倒なのでWLS2のUbuntu上で実行します。 $ echo -n "こんにちは、音声合成の世界へようこそ" > text.txt $ curl -s -X POST "127.0.0.1:50021/audio_query?speaker=1" --get --data-urlencode text@text.txt > query.json $ curl -s -H "Content-Type: application/...