@tracio/vue パッケージはコアの @tracio/sdk をラップし、Vue 3 のイディオムに沿ったプリミティブを公開します。エージェントをマウントするプラグインと、訪問者IDおよび識別結果をリアクティブな ref として渡すコンポーザブルです。
npm install @tracio/vue @tracio/sdkvue（3.4 以降）は peer dependency であり、アプリにすでにインストールされていることが前提です。
app.use(TracioPlugin, options) でアプリインスタンスにプラグインをインストールします。options はフラットな設定（publicKey を持つ）または完全な TracioConfig を持つ { config } のいずれかを受け付けます。
// main.tsimport { createApp } from "vue"import { TracioPlugin } from "@tracio/vue"import App from "./App.vue"createApp(App) .use(TracioPlugin, { publicKey: import.meta.env.VITE_TRACIO_KEY }) .mount("#app")各コンポーザブルは data、isLoading、error、isFetched の Vue ref に加え、命令的に（再）取得するための getData メソッドを返します。命令的メソッドはすべての Vue コンポーザブルで getData という名前である点に注意してください。React スタイルの getId は存在しません。
安定した訪問者識別子を、ローディングおよびエラー状態とともに返します。
const { data, isLoading, error, isFetched, getData } = useVisitorId()// data: Ref<string | null> — the visitorId// getData(): Promise<void> — re-runs the underlying result fetch完全な TracioResult（訪問者IDとボット検知）を返します。opts.immediate はデフォルトで true です。{ immediate: false } を渡すと、getData() を呼び出すまで取得を遅延できます。たとえば同意ゲートの背後で使用する場合です。
const { data, isLoading, error, isFetched, getData } = useTracioResult()// data: Ref<TracioResult | null>高度な用途向けに、基盤となる TracioInstance（コンポーネントの上位にプラグインがインストールされていない場合は undefined）を返すエスケープハッチです。インスタンスを直接返すため、分割代入するラッパーオブジェクトはありません。
const tracio = useTracio()// main.tsimport { createApp } from "vue"import { TracioPlugin } from "@tracio/vue"import App from "./App.vue"createApp(App) .use(TracioPlugin, { publicKey: import.meta.env.VITE_TRACIO_KEY }) .mount("#app")<script setup lang="ts">import { useVisitorId } from "@tracio/vue"const { data: visitorId, isLoading, error } = useVisitorId()</script><template> <span v-if="isLoading">Loading…</span> <span v-else-if="error">Error: {{ error.message }}</span> <span v-else>Visitor: {{ visitorId }}</span></template>@tracio/sdk API