Vue 3 に SwaggerUI を統合する — そしてジェダイ開発者のように拡張する

Vue 3アプリケーションにSwagger UIを統合するには、パッケージをインストールし、Vueアプリケーション内で初期化する必要があります。 SwaggerUIパッケージは、DOMが完全にレンダリングされたことを確認してからSwaggerUIをUIにマウントするために、`onMounted`ライフサイクルフックで初期化されます。 SwaggerUIインスタンスは、Open API仕様ファイルまたはサーバーURLで設定できます。 カスタムプラグインを作成するには、SwaggerUIをカスタマイズするために既存のUIコンポーネントをラップするか、新しいコンポーネントを作成します。 SwaggerUIはReact上に構築されているため、プラグインもReactで構築する必要があります。 プラグイン構造には、ラップするコンポーネントを含むオブジェクトを返す関数を作成することが含まれます。 Vueアプリケーションとプラグイン間で状態を同期するには、新しい状態が定義され、文字を設定するためのアクションがディスパッチされます。 次に、状態がストアから選択され、`CharacterCard`コンポーネントのレンダリングに使用されます。 プラグインの型付けを行うには、`tsconfig.json`ファイルを構成して、合成デフォルトインポートと`esModuleInterop`を許可する必要があります。 最後に、SwaggerUIインスタンスとシステムパラメータの型付けを行うには、SwaggerUIインスタンスとシステムパラメータのインターフェースを作成します。