aeo.js

• Quick Start
• What is AEO?
• Why AEO
• Widget
• Configuration
• Generated Files
• Checker

Quick Start

npm install aeo.js

Astro

astro.config.mjs

import { defineConfig } from 'astro/config';
import { aeoAstroIntegration } from 'aeo.js/astro';

export default defineConfig({
  site: 'https://mysite.com',
  integrations: [
    aeoAstroIntegration({
      title: 'My Site',
      description: 'A site optimized for AI discovery',
      url: 'https://mysite.com',
    }),
  ],
});

Next.js

next.config.mjs

import { withAeo } from 'aeo.js/next';

export default withAeo({
  aeo: {
    title: 'My Site',
    description: 'A site optimized for AI discovery',
    url: 'https://mysite.com',
  },
});

Add the post-build step to package.json:

{
  "scripts": {
    "postbuild": "node -e \"import('aeo.js/next').then(m => m.postBuild({ title: 'My Site', url: 'https://mysite.com' }))\""
  }
}

Vite

vite.config.ts

import { defineConfig } from 'vite';
import { aeoVitePlugin } from 'aeo.js/vite';

export default defineConfig({
  plugins: [
    aeoVitePlugin({
      title: 'My Site',
      description: 'A site optimized for AI discovery',
      url: 'https://mysite.com',
    }),
  ],
});

Nuxt

nuxt.config.ts

export default defineNuxtConfig({
  modules: ['aeo.js/nuxt'],
  aeo: {
    title: 'My Site',
    description: 'A site optimized for AI discovery',
    url: 'https://mysite.com',
  },
});

Angular

Add a post-build step to package.json:

{
  "scripts": {
    "postbuild": "node -e \"import('aeo.js/angular').then(m => m.postBuild({ title: 'My App', url: 'https://myapp.com' }))\""
  }
}

Or generate programmatically:

import { generate } from 'aeo.js/angular';
await generate({ title: 'My App', url: 'https://myapp.com' });

Webpack

webpack.config.js

const { AeoWebpackPlugin } = require('aeo.js/webpack');

module.exports = {
  plugins: [
    new AeoWebpackPlugin({
      title: 'My Site',
      description: 'A site optimized for AI discovery',
      url: 'https://mysite.com',
    }),
  ],
};

CLI

No framework needed — run standalone:

# Generate all AEO files
npx aeo.js generate --url https://mysite.com --title "My Site"

# Scaffold a config file
npx aeo.js init

# Check your setup
npx aeo.js check

What is AEO?

Answer Engine Optimization (AEO) is the practice of making your website discoverable and citable by AI-powered answer engines like ChatGPT, Claude, Perplexity, and SearchGPT.

aeo.js auto-generates the files these engines look for and provides a drop-in widget that shows visitors how your site appears to AI. First-class support for Astro, Next.js, Vite, Nuxt, Angular, and Webpack — or run standalone via CLI.

Why AEO matters

58%

of searches

end without a click — AI gives the answer directly

40%

of Gen Z

prefer AI assistants over traditional search engines

97%

of sites

have no llms.txt or structured data for AI crawlers

1 min

to set up

aeo.js generates robots.txt, llms.txt, schema & more

If your site isn’t optimized for AI engines, you’re invisible to a growing share of users who never open a search results page. AEO is the new SEO.

Widget

The Human/AI widget lets visitors toggle between the normal page and its AI-readable markdown version. Framework plugins inject it automatically — for Next.js or manual setups:

'use client';
import { useEffect } from 'react';

export function AeoWidgetLoader() {
  useEffect(() => {
    import('aeo.js/widget').then(({ AeoWidget }) => {
      new AeoWidget({
        config: {
          title: 'My Site',
          url: 'https://mysite.com',
          widget: { enabled: true, position: 'bottom-right' },
        },
      });
    });
  }, []);
  return null;
}

React and Vue wrapper components are also available:

React

import { AeoReactWidget } from 'aeo.js/react';

<AeoReactWidget config={{ title: 'My Site', url: 'https://mysite.com' }} />

Vue

<script setup>
import { AeoVueWidget } from 'aeo.js/vue';
</script>

<template>
  <AeoVueWidget :config="{ title: 'My Site', url: 'https://mysite.com' }" />
</template>

Configuration

All frameworks use the same config shape — see full reference:

import { defineConfig } from 'aeo.js';

export default defineConfig({
  title: 'My Site',
  url: 'https://mysite.com',
  description: 'A site optimized for AI discovery',

  generators: {
    robotsTxt: true,
    llmsTxt: true,
    llmsFullTxt: true,
    rawMarkdown: true,
    sitemap: true,
    aiIndex: true,
    schema: true,
  },

  schema: {
    enabled: true,
    organization: { name: 'My Company', url: 'https://mysite.com' },
    defaultType: 'WebPage',
  },

  og: {
    enabled: true,
    image: 'https://mysite.com/og.png',
    twitterHandle: '@mycompany',
  },

  widget: {
    enabled: true,
    position: 'bottom-right',
    theme: { accent: '#4ADE80', badge: '#4ADE80' },
  },
});

Generated Files

After building, your output directory contains:

public/
├── robots.txt          # AI-crawler directives
├── llms.txt            # Short LLM-readable summary
├── llms-full.txt       # Full content for LLMs
├── sitemap.xml         # Standard sitemap
├── docs.json           # Documentation manifest
├── ai-index.json       # AI content index
├── index.md            # Markdown for /
└── about.md            # Markdown for /about

Checker

Scan

Free — no signup required. Powered by AEO Checker