文本,vitepress如何配置搜索框

简介: 文本,vitepress如何配置搜索框

vitepress搭建并部署网站 | AlbertZhang的文档网站 (bugdesigner.cn)

参考资料如上:

今天想在vitepress头部上配置一下搜索框:

直接来到config.js目录下

在config.js文件下添加如下代码:

   // 设置搜索框的样式
    search: {
      provider: "local",
      options: {
        translations: {
          button: {
            buttonText: "搜索文档",
            buttonAriaLabel: "搜索文档",
          },
          modal: {
            noResultsText: "无法找到相关结果",
            resetButtonTitle: "清除查询条件",
            footer: {
              selectText: "选择",
              navigateText: "切换",
            },
          },
        },
      },
    },

这样搜索框出现了


相关文章
|
自然语言处理 JavaScript 前端开发
使用Pagefind为VitePress文档添加离线全文搜索能力
前言 VitePress 相信大家都或多或少听说过或者用过了 默认 UI相比 VuePress2.x 好看,启动速度也快(由Vite驱动,当然VuePress也可以切换构建引擎至Vite) 做内容定制也相对简单,笔者的很多静态文档站点(使用VuePress1.x),文章内容多的时候启动非常的慢,于是就从之前的 VuePress 迁移到了 VitePress,并做了一个博客主题 @sugarat/theme => 之前也有过介绍一个简约风的VitePress博客主题 但是 VitePress 官方目前还没有内置开箱即用的搜索能力(相关PR还在施工中)
1096 0
Failed to execute script ‘xxx‘ due to unhandled exception:No module named ‘ctypes‘
Failed to execute script ‘xxx‘ due to unhandled exception:No module named ‘ctypes‘
770 0
|
10月前
|
前端开发 搜索推荐 开发者
如何快速创建一个轻量美观的导航站?Typecho + MijiNav组合轻松完成
在信息过载的数字化时代,打造一个高质量、美观的网址导航页至关重要。本文推荐使用Typecho + MijiNav组合,轻松实现个性化导航网站。Typecho作为轻量级博客系统,安装简单、资源占用低;MijiNav主题设计现代、响应式适配多设备,并支持灵活自定义。通过三步:安装Typecho、配置MijiNav主题、自定义内容,非开发者也能快速搭建专业级导航页,满足个人与企业需求。
723 40
|
10月前
|
存储 数据可视化 数据处理
optisystem输出到matlab的数据结构
optisystem输出到matlab的数据结构
|
数据采集 机器学习/深度学习 人工智能
Sitcom-Crafter:动画师失业警告!AI黑科技自动生成3D角色动作,剧情脚本秒变动画
Sitcom-Crafter 是一款基于剧情驱动的 3D 动作生成系统,通过多模块协同工作,支持人类行走、场景交互和多人交互,适用于动画、游戏及虚拟现实等领域。
817 4
|
JSON JavaScript 小程序
使用VSCode搭建UniApp + TS + Vue3 + Vite项目
`uniapp` 是一个基于 Vue.js 的框架,支持一次开发多端部署,深受前端开发者喜爱。本文详细介绍如何使用 `VSCode` 搭建 `uniapp` 项目,包括安装 `node` 和 `pnpm`、创建项目、安装扩展组件、配置 `Json` 文件注释及安装相关插件。通过这些步骤,你可以高效地使用 `VSCode` 开发 `uniapp` 项目,并享受代码提示和自动补全功能,提高开发效率。
1441 24
使用VSCode搭建UniApp + TS + Vue3 + Vite项目
|
JavaScript 前端开发 API
vue3 v-md-editor markdown编辑器(VMdEditor)和预览组件(VMdPreview )的使用
本文介绍了如何在Vue 3项目中使用v-md-editor组件库来创建markdown编辑器和预览组件。文章提供了安装步骤、如何在main.js中进行全局配置、以及如何在页面中使用VMdEditor和VMdPreview组件的示例代码。此外,还提供了一个完整示例的链接,包括编辑器和预览组件的使用效果和代码。
vue3 v-md-editor markdown编辑器(VMdEditor)和预览组件(VMdPreview )的使用
|
机器学习/深度学习 监控 PyTorch
深度学习工程实践:PyTorch Lightning与Ignite框架的技术特性对比分析
在深度学习框架的选择上,PyTorch Lightning和Ignite代表了两种不同的技术路线。本文将从技术实现的角度,深入分析这两个框架在实际应用中的差异,为开发者提供客观的技术参考。
455 7
|
小程序 网络协议 物联网
小程序AP配网和AK配网教程(开源)
小程序AP配网和AK配网教程(开源)
1292 0
|
JavaScript 网络安全 开发工具
笔记:关于使用vitepress 制作静态站点并托管到 gitee
笔记:关于使用vitepress 制作静态站点并托管到 gitee
2103 0

热门文章

最新文章