OriaTheme
GitHub

APIリファレンス・Vue

@oriatheme/vue

1 つのランタイムを Vue プラグインに接続し、ランタイム状態をミラーリングせずに提供し、コンポーザブルにします。

パッケージと環境

ブラウザプラグイン/Vue 3.5用に提供;モジュール自体は SSR に対して安全にインポートできます。

bash
pnpm add @oriatheme/presets @oriatheme/runtime-dom @oriatheme/vue

コンシューマ プロジェクトによってすでに選択されているパッケージ マネージャーとロックファイルを使用します。例では、パッケージ ルート エクスポートのみを使用します。 src、dist、またはレジストリ テンプレートからディープ インポートしないでください。

Exports

エクスポート署名説明
createOriaTheme(config: OriaThemeConfig) => Plugin構築するランタイムを所有するプラグインを作成します。
provideOriaTheme(config | runtime) => OriaThemeRuntime現在のツリー内に所有または呼び出し元が提供するランタイムを提供します。
useOriaTheme() => { snapshot, runtime, setTheme, setAppearance }ランタイムと読み取り専用の浅いスナップショット参照を返します。
vue
<script setup lang="ts">
import { useOriaTheme } from "@oriatheme/vue";
const { snapshot, setAppearance } = useOriaTheme();
</script>
<template><button @click="setAppearance('system')">{{ snapshot.resolvedMode }}</button></template>

重要な種類と境界

スナップショットは DeepReadonly<ShallowRef<ThemeSnapshot>> です。テーマ、外観、またはresolvedModeをPoniaまたは別のストアにミラーリングしないでください。