Skip to content

Commit 8e45e56

Browse files
committed
docs: lazy laod docsearch to avoid ssr errors
1 parent 042f48a commit 8e45e56

File tree

1 file changed

+29
-26
lines changed

1 file changed

+29
-26
lines changed

docs/.vitepress/theme/AlgoliaSearchBox.vue

+29-26
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
<script setup lang="ts">
2-
import 'docsearch.js/dist/cdn/docsearch.min.css'
3-
import docsearch from 'docsearch.js/dist/cdn/docsearch.min.js'
42
import { useRoute, useRouter, useData } from 'vitepress'
53
import { getCurrentInstance, onMounted, watch } from 'vue'
64
const props = defineProps<{
@@ -57,32 +55,37 @@ watch(
5755
}
5856
)
5957
function initialize(userOptions: any) {
60-
const { algoliaOptions = {}} = userOptions
61-
docsearch(Object.assign(
62-
{},
63-
userOptions,
64-
{
65-
inputSelector: '#algolia-search-input',
66-
// #697 Make docsearch work well at i18n mode.
67-
algoliaOptions: {
68-
...algoliaOptions,
69-
facetFilters: [`lang:${lang.value}`].concat(algoliaOptions.facetFilters || [])
70-
},
71-
handleSelected: (input, event, suggestion) => {
72-
const { pathname, hash } = new URL(suggestion.url)
58+
Promise.all([
59+
import('docsearch.js/dist/cdn/docsearch.min.js'),
60+
import('docsearch.js/dist/cdn/docsearch.min.css')
61+
]).then(([docsearch]) => {
62+
const { algoliaOptions = {}} = userOptions
63+
docsearch.default(Object.assign(
64+
{},
65+
userOptions,
66+
{
67+
inputSelector: '#algolia-search-input',
68+
// #697 Make docsearch work well at i18n mode.
69+
algoliaOptions: {
70+
...algoliaOptions,
71+
facetFilters: [`lang:${lang.value}`].concat(algoliaOptions.facetFilters || [])
72+
},
73+
handleSelected: (input, event, suggestion) => {
74+
const { pathname, hash } = new URL(suggestion.url)
7375
74-
// Router doesn't handle same-page navigation so we use the native
75-
// browser location API for anchor navigation
76-
if (route.path === pathname) {
77-
window.location.assign(suggestion.url)
78-
} else {
79-
const routepath = pathname.replace(site.base, '/')
80-
const _hash = decodeURIComponent(hash)
81-
router.go(`${routepath}${_hash}`)
76+
// Router doesn't handle same-page navigation so we use the native
77+
// browser location API for anchor navigation
78+
if (route.path === pathname) {
79+
window.location.assign(suggestion.url)
80+
} else {
81+
const routepath = pathname.replace(site.base, '/')
82+
const _hash = decodeURIComponent(hash)
83+
router.go(`${routepath}${_hash}`)
84+
}
8285
}
83-
}
84-
})
85-
)
86+
})
87+
)
88+
})
8689
}
8790
</script>
8891

0 commit comments

Comments
 (0)