Velin

Have you wondered how it feels if you can develop the prompts of agents and MCP servers with the power of Vue?

Develop prompts with Vue SFC or Markdown like pro.

We got a playground too, check it out:

Quick Start

Try it by running following command under your pnpm/npm project.

# For browser users
npm i @velin-dev/vue

# For Node.js, CI, server rendering and backend users
npm i @velin-dev/core

Features

• No longer need to fight and format with the non-supported DSL of templating language!
• Use HTML elements like <div> for block elements, <span> for inline elements.
• Directives with native Vue template syntax, v-if, v-else all works.
• Compositing other open sourced prompt component or composables over memory system.

All included...

How it feels

<!-- Prompt.vue -->
<script setup lang="ts">
defineProps<{
  name: string
}>()
</script>

<template>
  <div>
    Hello world, this is {{ name }}!
  </div>
</template>

In Node.js

import { readFile } from 'node:fs/promises'

import { renderSFCString } from '@velin-dev/core'
import { ref } from 'vue'

const source = await readFile('./Prompt.vue', 'utf-8')
const name = ref<string>('Velin')
const result = await renderSFCString(source, { name })

console.log(result)
// Hello world, this is Velin!

In Vue / Browser

<script setup lang="ts">
import { usePrompt } from '@velin-dev/vue'
import { ref, watch } from 'vue'

import Prompt from './Prompt.vue'

const language = ref<string>('Velin')
const { prompt, onPrompted } = usePrompt(Prompt, { name })

watch(prompt, () => {
  console.log(prompt)
  // // Hello world, this is Velin!
})
</script>

Similar projects

• poml / pomljs

Development

Clone

git clone https://github.com/moeru-ai/velin.git
cd airi

Install dependencies

corepack enable
pnpm install

corepack enable
npm i -g @antfu/ni

pnpm dev

nr dev

Build

pnpm build

nr build

License

MIT