vueuse-core-skilld

@vueuse/core 15.0.0

準備済みのソース：@vueuse/[email protected]（package.json:4）。以下のファイル引用は、このパッケージのルートからの相対パスです。ドキュメントの引用は絶対URLです。

環境の制限

• v13 以降は ESM 専用です（"type": "module"、package.json:3）。require() は失敗します。
• Vue ^3.5.0 が必要です（package.json:42）。
• Node.js >= 22 が必要です（package.json:39）。v15.0.0 で Node 20 のサポートは終了しました （リリース）。
• エクスポート対象は . と ./metadata です（package.json:24-28）。すべて dist/ から提供されます。
• @vueuse/[email protected] は依存関係であり、すべて再エクスポートされます （dist/index.d.ts:3）。そのため、import { useToggle } from '@vueuse/core' が使えます。shared API を参照してください。

生成コードに影響する v15 のルール

1. templateRef は使えません。 v15.0.0 で削除されました （リリース）。代わりに Vue 組み込みの useTemplateRef() を使用してください。
2. タイマーオプションは廃止されました。scheduler を渡してください。 コンポーザブルごとに指定する非推奨の interval／immediate オプションは、v15.0.0 で ConfigurableScheduler コンポーザブルから削除されました（リリース）。 対象となるオプションのインターフェースは ConfigurableScheduler を継承または交差しています（dist/index.d.ts:212-217）：useCountdown、useNow、useTimestamp、 useTimeAgo、useTimeAgoIntl、useTemporalNow、useElementByPoint、 useMemory、useVibrate、および useWebSocket の heartbeat オプションです。 scheduler は (cb: Fn) => Pausable なので、useRafFn をそのまま渡せます。
3. useThrottleFn はデフォルトで末尾の呼び出しを実行するようになりました（trailing のデフォルト値が false から true に変更されました。v15.0.0 （リリース））。v14 の動作を維持するには、 trailing = false（第 3 引数）を渡してください。
4. useEventSource は SSE の message イベントを処理し、onmessage と addEventListener の両方のハンドラーを呼び出します（v15.0.0 （リリース））。名前のないイベントに対して、 重複するリスナーを手動で追加しないでください。
5. 次のメジャーリリースでは deepRefs のデフォルト値が変わります。 現在のデフォルト値は true で、次のメジャーリリースでは false に変更されることが明示的に警告されています （dist/index.d.ts:204-211）。値が重要な場合は、deepRefs を明示的に渡してください。

使用しないでください（非推奨または置き換え済み）

エクスポート	置き換え先	根拠
computedEager	computed()（Vue 3.4+ では、値が変わらない場合に再トリガーされなくなりました）	ドキュメント「将来のバージョンで削除されます」
watchPausable	Vue 3.5 のネイティブ watch() は { stop, pause, resume } を返します	ドキュメント
executeTransition	transition(source, from, to, options)	dist/index.d.ts:5114-5121 で非推奨
UseTransitionOptions.transition	easing オプション	同じ非推奨ブロック
breakpointsVuetify	breakpointsVuetifyV2 または breakpointsVuetifyV3	dist/index.d.ts:758-762 で非推奨
asyncComputed	computedAsync（エイリアスは引き続き使用可能。dist/index.d.ts:46）	computedAsync のエイリアス

よくあるタスク

import { useLocalStorage, useDark, useTitle, useThrottleFn } from '@vueuse/core'

// Reactive getter args enable derived values without computed()
const isDark = useDark()
const title = useTitle(() => isDark.value ? 'Night' : 'Day')

// Storage with schema evolution: mergeDefaults fills new keys
const settings = useLocalStorage('settings', { theme: 'light', density: 'comfortable' }, { mergeDefaults: true })

// v15 throttle fires a trailing call by default; 3rd arg is `trailing`
const onResize = useThrottleFn(handler, 200, false, true) // trailing=false, leading=true

import { useWebMCP } from '@vueuse/core'

// Register a WebMCP tool for browser agents (new in v15)
const { isSupported, isRegistered, error } = useWebMCP({
  name: 'get-current-user',
  description: 'Returns the signed-in user id',
  inputSchema: { type: 'object' },
  execute: () => ({ userId: user.value?.id ?? null }),
})

その他のパターン：ベストプラクティス。

リファレンス

• API 一覧：v15 の全エクスポートを分類して掲載しています。
• Shared API：core から再エクスポートされる @vueuse/shared の関数。
• v14 から v15 への移行：v14.3.0 以降の破壊的変更、機能、注目すべき修正をすべて引用付きで掲載しています。
• v15 の新しい関数：useWebMCP、useTemporalNow、useLiveAnnouncer、useElementOverflow の使用方法。
• ベストプラクティス：ゲッター、イベントフィルター、ストレージシリアライザー、スケジューラー、SSR、スコープ設定。

デバッグに関する注意点（動作の変更を説明する可能性のある v15 の修正）

• useFetch は、新しいリクエストの開始後に届いた古い成功レスポンスを無視し、再フェッチの成功後に届いた古い中断エラーも無視します (v15、 v14.4)。
• useWebSocket は、置き換えられたソケットからのメッセージを無視し、明示的な close() の後にステータスを CLOSED に同期します（同じリリース）。
• useResizeObserver は instanceof Element で observe() を保護するため、Vue のコメントノードでクラッシュしなくなりました（v15）。
• ポインター処理：useDraggable と usePointerSwipe は pointercancel で終了し、usePointer は isInside をリセットし、onLongPress は保留中の押下をクリアします (v15、 v14.4)。