Skip to content

Commit 663ee53

Browse files
kriskkrisk
committed
docs: migrate site from VuePress to VitePress
Replaces the VuePress docs setup with VitePress: ports the config, theme, and all custom components (UsedBy, Sponsors, CarbonAds, PublishDate, ArchitectureDiagram, demos, Playground, etc.), and restyles to match the Vue.js docs aesthetic — unified navbar, left-flush outline with overhanging marker, no link underlines, tighter h2 spacing, sponsor-button color preserved. Updates the deploy workflow to publish from docs/.vitepress/dist and gitignores the new dist/cache paths.
1 parent 7b42845 commit 663ee53

90 files changed

Lines changed: 6190 additions & 11298 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.github/workflows/deploy-docs.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,5 +20,5 @@ jobs:
2020
- uses: peaceiris/actions-gh-pages@v4
2121
with:
2222
github_token: ${{ secrets.GITHUB_TOKEN }}
23-
publish_dir: docs/.vuepress/dist
23+
publish_dir: docs/.vitepress/dist
2424
cname: www.fusejs.io

‎.gitignore‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ node_modules/
33
.DS_Store
44

55
.claude/
6+
CLAUDE.md
67
.idea/
78
.vs/
89
.vscode/
@@ -12,7 +13,8 @@ yarn.lock
1213
dist/*.d.ts
1314
dist/*.map
1415

15-
docs/.vuepress/dist
16+
docs/.vitepress/dist
17+
docs/.vitepress/cache
1618
.temp
1719
.cache
1820
drafts/

‎.nvmrc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
20

‎docs/.vitepress/config.ts‎

Lines changed: 147 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,147 @@
1+
import { defineConfig, type HeadConfig } from 'vitepress'
2+
import { version } from '../../package.json'
3+
4+
const SITE_URL = 'https://www.fusejs.io'
5+
const GA_MEASUREMENT_ID = 'G-78VK1PFWH1'
6+
const GOOGLE_SITE_VERIFICATION = '4nm40QLVcDJmEJSAbrMfZ7fpBJZIXL1oSngBAYrZopY'
7+
8+
export default defineConfig({
9+
lang: 'en-US',
10+
title: 'Fuse.js',
11+
description: 'Lightweight fuzzy-search library, in JavaScript',
12+
13+
cleanUrls: false,
14+
15+
sitemap: {
16+
hostname: SITE_URL
17+
},
18+
19+
head: getHead(),
20+
21+
themeConfig: {
22+
logo: '/assets/img/logo.png',
23+
24+
nav: [
25+
{ text: 'Docs', link: '/' },
26+
{ text: 'Demo', link: '/demo' },
27+
{ text: 'Sponsor', link: '/sponsor' },
28+
{ text: 'Cloud', link: '/cloud' }
29+
],
30+
31+
sidebar: [
32+
{ text: 'Getting Started', link: '/getting-started' },
33+
{ text: 'Fuzzy Search', link: '/fuzzy-search' },
34+
{ text: 'Token Search', link: '/token-search' },
35+
{ text: 'Extended Search', link: '/extended-search' },
36+
{ text: 'Logical Search', link: '/logical-search' },
37+
{ text: 'Web Workers', link: '/web-workers' },
38+
{ text: 'Performance', link: '/performance' },
39+
{
40+
text: 'Articles',
41+
items: [
42+
{ text: 'Using Fuse with React', link: '/articles/using-fuse-with-react' },
43+
{ text: 'vs Semantic Search', link: '/articles/vs-semantic-search' },
44+
{ text: 'How Fuzzy Search Works', link: '/articles/how-fuzzy-search-works' }
45+
]
46+
}
47+
],
48+
49+
outline: { level: [2, 3], label: 'On this page' },
50+
51+
socialLinks: [
52+
{ icon: 'github', link: 'https://github.com/krisk/fuse' },
53+
{ icon: 'x', link: 'https://x.com/kirorisk' }
54+
],
55+
56+
search: {
57+
provider: 'local'
58+
},
59+
60+
docFooter: {
61+
prev: 'Previous',
62+
next: 'Next'
63+
},
64+
65+
editLink: undefined
66+
},
67+
68+
markdown: {
69+
theme: { light: 'github-dark', dark: 'github-dark' }
70+
},
71+
72+
vite: {
73+
server: { port: 3000 },
74+
optimizeDeps: {
75+
include: ['monaco-editor']
76+
}
77+
}
78+
})
79+
80+
function getHead(): HeadConfig[] {
81+
const appleTouchIcons: HeadConfig[] = [
82+
'57x57',
83+
'60x60',
84+
'72x72',
85+
'76x76',
86+
'114x114',
87+
'120x120',
88+
'144x144',
89+
'152x152',
90+
'180x180'
91+
].map((size) => [
92+
'link',
93+
{ rel: 'apple-touch-icon', size, href: `/icons/apple-icon-${size}.png` }
94+
])
95+
96+
const sizedIcons: HeadConfig[] = [
97+
{ size: '192x192', href: 'android-icon-192x192.png' },
98+
{ size: '32x32', href: 'favicon-32x32.png' },
99+
{ size: '96x96', href: 'favicon-96x96.png' },
100+
{ size: '16x16', href: 'favicon-16x16.png' }
101+
].map(({ size, href }) => [
102+
'link',
103+
{ rel: 'icon', type: 'image/png', size, href: `/icons/${href}` }
104+
])
105+
106+
const meta: HeadConfig[] = [
107+
['meta', { name: 'msapplication-TileColor', content: '#ffffff' }],
108+
['meta', { name: 'msapplication-TileImage', content: '/icons/ms-icon-144x144.png' }],
109+
['meta', { name: 'theme-color', content: '#ffffff' }],
110+
['meta', { name: 'google-site-verification', content: GOOGLE_SITE_VERIFICATION }]
111+
]
112+
113+
const og: HeadConfig[] = [
114+
['meta', { property: 'og:type', content: 'website' }],
115+
['meta', { property: 'og:site_name', content: 'Fuse.js' }],
116+
['meta', { property: 'og:title', content: 'Fuse.js — Lightweight Fuzzy-Search Library' }],
117+
['meta', { property: 'og:description', content: 'Powerful, lightweight fuzzy-search library for JavaScript with zero dependencies.' }],
118+
['meta', { property: 'og:url', content: SITE_URL }],
119+
['meta', { property: 'og:image', content: `${SITE_URL}/assets/img/logo.png` }],
120+
['meta', { name: 'twitter:card', content: 'summary' }],
121+
['meta', { name: 'twitter:site', content: '@kirorisk' }],
122+
['meta', { name: 'twitter:title', content: 'Fuse.js — Lightweight Fuzzy-Search Library' }],
123+
['meta', { name: 'twitter:description', content: 'Powerful, lightweight fuzzy-search library for JavaScript with zero dependencies.' }],
124+
['meta', { name: 'twitter:image', content: `${SITE_URL}/assets/img/logo.png` }]
125+
]
126+
127+
const ga: HeadConfig[] = [
128+
['script', { async: '', src: `https://www.googletagmanager.com/gtag/js?id=${GA_MEASUREMENT_ID}` }],
129+
[
130+
'script',
131+
{},
132+
`window.dataLayer = window.dataLayer || [];
133+
function gtag(){dataLayer.push(arguments);}
134+
gtag('js', new Date());
135+
gtag('config', '${GA_MEASUREMENT_ID}');`
136+
]
137+
]
138+
139+
return [
140+
...appleTouchIcons,
141+
...sizedIcons,
142+
...meta,
143+
...og,
144+
['link', { rel: 'manifest', href: '/manifest.webmanifest' }],
145+
...ga
146+
]
147+
}

‎docs/.vitepress/env.d.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/// <reference types="vite/client" />

‎docs/.vitepress/theme/Layout.vue‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<script setup lang="ts">
2+
import DefaultTheme from 'vitepress/theme'
3+
import CarbonAds from './components/CarbonAds.vue'
4+
import Sponsors from './components/Sponsors.vue'
5+
6+
const { Layout } = DefaultTheme
7+
</script>
8+
9+
<template>
10+
<Layout>
11+
<template #aside-outline-after>
12+
<Sponsors />
13+
<CarbonAds />
14+
</template>
15+
</Layout>
16+
</template>

docs/.vuepress/components/ArchitectureDiagram/ArchitectureDiagram.vue renamed to docs/.vitepress/theme/components/ArchitectureDiagram.vue

File renamed without changes.

docs/.vuepress/components/BitapDemo/BitapDemo.vue renamed to docs/.vitepress/theme/components/BitapDemo.vue

File renamed without changes.

‎docs/.vitepress/theme/components/CarbonAds.vue‎

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
<script setup lang="ts">
2+
import { onMounted, ref, watch } from 'vue'
3+
import { useRoute } from 'vitepress'
4+
5+
const CARBON_SERVE_CODE = 'CE7IC27U'
6+
const CARBON_PLACEMENT = 'fusejsio'
7+
const SCRIPT_ID = '_carbonads_js'
8+
9+
const container = ref<HTMLDivElement | null>(null)
10+
const route = useRoute()
11+
12+
function loadCarbonAds() {
13+
if (!container.value) return
14+
container.value.innerHTML = ''
15+
const script = document.createElement('script')
16+
script.async = true
17+
script.id = SCRIPT_ID
18+
script.src = `//cdn.carbonads.com/carbon.js?serve=${CARBON_SERVE_CODE}&placement=${CARBON_PLACEMENT}`
19+
container.value.appendChild(script)
20+
}
21+
22+
onMounted(loadCarbonAds)
23+
24+
// carbon.js fires once on initial load; reload on SPA navigation.
25+
watch(() => route.path, loadCarbonAds)
26+
</script>
27+
28+
<template>
29+
<div ref="container" class="carbon-ads-container" />
30+
</template>
31+
32+
<style>
33+
.carbon-ads-container {
34+
margin: 32px 0 0;
35+
min-height: 102px;
36+
}
37+
38+
#carbonads {
39+
font-family: var(--vp-font-family-base);
40+
font-size: 12px;
41+
line-height: 1.4;
42+
display: block;
43+
background-color: var(--vp-c-bg-soft);
44+
border: 1px solid var(--vp-c-divider-light);
45+
border-radius: 6px;
46+
padding: 12px;
47+
transition: border-color 0.2s;
48+
}
49+
50+
#carbonads:hover {
51+
border-color: var(--vp-c-brand-1);
52+
}
53+
54+
#carbonads a,
55+
#carbonads a:hover {
56+
color: var(--vp-c-text-1);
57+
text-decoration: none;
58+
}
59+
60+
#carbonads .carbon-img {
61+
display: block;
62+
margin-bottom: 8px;
63+
}
64+
65+
#carbonads .carbon-img img {
66+
display: block;
67+
max-width: 100%;
68+
}
69+
70+
#carbonads .carbon-text {
71+
display: block;
72+
font-weight: 500;
73+
color: var(--vp-c-text-1);
74+
}
75+
76+
#carbonads .carbon-poweredby {
77+
display: block;
78+
margin-top: 8px;
79+
font-size: 10px;
80+
color: var(--vp-c-text-3);
81+
text-transform: uppercase;
82+
letter-spacing: 0.05em;
83+
}
84+
</style>

docs/.vuepress/components/CommercialCTA/CommercialCTA.vue renamed to docs/.vitepress/theme/components/CommercialCTA.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
<div class="commercial-cta">
33
<div class="commercial-cta-inner">
44
<strong>Using Fuse.js in production?</strong>
5-
Get priority support, SLA guarantees, and invoice payment with a
6-
<a href="/team-plans.html">support plan</a>.
5+
Skip managing the index and infrastructure with
6+
<a href="/cloud.html">Fuse Cloud</a>.
77
</div>
88
</div>
99
</template>

0 commit comments

Comments
 (0)