vue-llmAI SDK для Vue, которого не хватало

Что такое vue-llm? ​

vue-llm — open-source библиотека на TypeScript, которая добавляет AI- и LLM-возможности в приложения на Vue 3 и Nuxt. В ней есть композаблы вроде useChat, которые стримят ответ модели в реактивное состояние, провайдеры для OpenAI, Anthropic Claude, Google Gemini, Ollama и моделей в браузере на WebGPU, а также компоненты для Generative UI.

<script setup lang="ts">
import { useChat } from 'vue-llm'
import { createSSEProvider } from 'vue-llm/providers'

const { messages, input, handleSubmit, status } = useChat({
  provider: createSSEProvider({ url: '/api/chat' }), // API-ключ хранится на вашем сервере
  model: 'gpt-4o',
})
</script>

<template>
  <div v-for="m in messages" :key="m.id">{{ m.role }}: {{ m.parts.map(p => p.type === 'text' ? p.text : '').join('') }}</div>
  <form @submit="handleSubmit">
    <input v-model="input" :disabled="status === 'streaming'">
  </form>
</template>

FAQ ​

Что такое vue-llm? ​

vue-llm — open-source библиотека на TypeScript, которая добавляет AI- и LLM-возможности в приложения на Vue и Nuxt. В ней есть композаблы useChat, useCompletion и useObject, которые стримят ответ модели в реактивное состояние, а также провайдеры для OpenAI, Anthropic, Google Gemini, Ollama и моделей в браузере на WebGPU.

Как сделать чат в духе ChatGPT на Vue? ​

Установите vue-llm, создайте провайдер (например, серверный прокси через createLLMHandler или createOpenAI на сервере) и вызовите useChat в компоненте. Он возвращает реактивные messages, input, status и sendMessage и стримит ответ токен за токеном.

Можно ли запустить LLM в браузере без API-ключа? ​

Да. createWebLLM запускает открытые модели — Llama 3.2, Qwen, SmolLM и другие — на GPU пользователя через WebGPU. Запросы не покидают устройство, сервер и API-ключ не нужны.

Работает ли vue-llm с Nuxt? ​

Да. Добавьте 'vue-llm/nuxt' в modules в nuxt.config — композаблы и провайдеры импортируются автоматически, а компоненты чата регистрируются. createLLMHandler превращает серверный маршрут Nuxt в безопасный прокси к модели.

Поддерживает ли vue-llm Vue 2? ​

Композаблы (useChat, useCompletion, useObject, usePrompt) работают на Vue 2.7 и Vue 3.3+. Компонентам нужен Vue 3.

Чем vue-llm отличается от Vercel AI SDK? ​

vue-llm создан в первую очередь для Vue. В него входят Nuxt-модуль, Vue-компоненты для Generative UI, WebGPU-провайдер для моделей в браузере, поддержка Vue 2.7 в композаблах и провайдер для существующих бэкендов на Server-Sent Events — и никаких runtime-зависимостей, кроме Vue.

vue-llm бесплатный? ​

Да. vue-llm распространяется по лицензии MIT и бесплатен для коммерческого использования.