API 参考 · Vue

@oriatheme/vue

将同一个 Runtime 接入 Vue Plugin、provide 与 Composable；不复制 Runtime 状态。

包与运行环境

Vue 3.5 的浏览器 Plugin/provide；模块本身可 SSR 导入。

bash

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

bash

npm install @oriatheme/presets @oriatheme/runtime-dom @oriatheme/vue

bash

yarn add @oriatheme/presets @oriatheme/runtime-dom @oriatheme/vue

bash

bun add @oriatheme/presets @oriatheme/runtime-dom @oriatheme/vue

选择使用方项目已有的一种包管理器和 lockfile；示例只使用 package root export，不要从 src、dist 或 registry template 深层导入。

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>

重要类型与边界

snapshot 是 DeepReadonly<ShallowRef<ThemeSnapshot>>。不要在 Pinia 或其他 store 里复制主题、appearance 或 resolvedMode。