VitePress Integration

Integrate Ask0 into your VitePress documentation site. Easy setup for adding semantic search and chat to VitePress docs.

Add Ask0 to your VitePress documentation site.

Installation

Theme Configuration

.vitepress/theme/index.ts

import DefaultTheme from 'vitepress/theme';
import { onMounted } from 'vue';

export default {
  extends: DefaultTheme,
  setup() {
    onMounted(() => {
      const script = document.createElement('script');
      script.src = 'https://assets.ask0.ai/scripts/ask.js';
      script.dataset.projectId = import.meta.env.VITE_ASK0_PROJECT_ID;
      document.body.appendChild(script);
    });
  }
};

Config File

.vitepress/config.ts

import { defineConfig } from 'vitepress';

export default defineConfig({
  title: 'My Docs',
  description: 'Documentation site',
  head: [
    [
      'script',
      {
        src: 'https://assets.ask0.ai/scripts/ask.js',
        'data-project-id': process.env.VITE_ASK0_PROJECT_ID,
        async: 'true'
      }
    ]
  ]
});

Custom Component

.vitepress/theme/components/Ask0.vue

<script setup>
import { onMounted } from 'vue';

onMounted(() => {
  if (window.ask0) {
    console.log('Ask0 ready');
  }
});

const openSupport = () => {
  window.ask0?.open();
};
</script>

<template>
  <button @click="openSupport">Ask AI</button>
</template>

Environment Variables

.env

VITE_ASK0_PROJECT_ID=your_project_id

VitePress Tips:

Add script in theme setup for client-side loading
Use head config for simpler integration
Prefix env vars with VITE_
Compatible with VitePress 1.0+