- 综合排序
- 最热优先
- 最新优先
Vitepress网站搭建教程
Vitepress网站搭建教程准备准备一台服务器用于网站上线 本地电脑安装pnpm本地电脑安装VSCode或webstorm安装安装vitepress官网地址：https://vitepress.dev /创建项目首先在桌面新建文件夹，打开cmd窗口，输入命令回车pnpm add -D vitepress初始化在文件夹cmd窗口输入命令，开始初始化vitepresspnpm vitepress init 以下是这些目录的含义.├─ docs # 项目根目录│ ├─ .vitepress│ │ ├─ theme│ │ │ └─ index.js # 主题入口│ │ └─ config.js # 配置文件│ └─ index.md # 主页相关└─ package.json 启动在cmd里面输入下面命令就可以运行vitepress #跳转到外部链接---主页下面部分主页的这些部分都是可以更改的 里面的icon图标都是可以自定义，替换成表情或者图片，vitepress默认是没有icon的，所以你需要手动添加或直接复制我下面的代码
1.9K10编辑于 2024-04-13- 来自专栏前端博客
vitepress搭建markdown文档博客
VitePress剪辑VitePress 是 VuePress 的下一代框架 ，是支持vue 3.0 的 web 网站框架。 VitePress 旨在降低当前 VuePress 的复杂性，并从其极简主义的根源重新开始。（Vue）除了 VitePress 之外，其他都是用 Webpack 作为开发服务器。 将 vitepress 执行命令添加到执行脚本中"scripts": { "dev": "vitepress dev docs --open", "build": "vitepress build 文件(VitePress 站点的基本文件是.VitePress/config.js，它应该导出一个 JavaScript 对象：) 查看配置参考以得到完整的选项列表// vitepress/config.jsmodule.exports 中注入脚本，执行脚本自动生成在 docs/.vitepress/theme 目录下"scripts": { "register:components": "vitepress-rc"}执行 npm
2.7K20编辑于 2023-06-06 - 来自专栏vitepress
VitePress 强大的静态网站生成器
什么是VitePress？VitePress 是一个静态站点生成器 (SSG)，专为构建快速、以内容为中心的网站而设计。 VitePress中文教程：https://vitepress.qzxdp.cn/用例文档 VitePress附带了一个默认主题，专为技术文档而设计，特别适用于需要嵌入交互式演示的文档。 此外，VitePress还提供了灵活的API，用于加载数据（本地或远程）和动态生成路由。 性能与许多传统的SSG不同，VitePress生成的网站实际上是一个单页应用程序 (SPA)。 VitePress 和 VuePress 之间的 API 差异主要在于主题和定制。如果您使用带有默认主题的 VuePress 1，那么迁移到 VitePress 应该相对简单。
1.7K20编辑于 2023-07-19 - 来自专栏front-end technology
vitePress快速搭建及部署一个博客
什么是 VitePress？ VitePress 是 VuePress 的小弟弟，但是vitepress是在 Vite 上构建的。 动机 主要是因为太慢！ VitePress目标是缩减掉当前 VuePress 的复杂性并从其极简主义的根源重新开始 2.VitePress 是面向未来的：其目标浏览器是只支持原生 ES 模块导入的浏览器。 yarn init yarn add --dev vitepress mkdir && echo '# Hello VitePress' > docs/index.md 2.添加这些脚本到 package.json { "scripts": { "docs:dev": "vitepress dev docs", "docs:build": "vitepress build docs", .vitepress/config.js 是配置 VitePress 站的必要的文件，其将导出一个 JavaScript 对象： module.exports = { title: 'Hello
3.9K40编辑于 2022-03-07 - 来自专栏其它
尤雨溪宣布推出 VitePress 1.0
前言尤雨溪宣布正式发布 VitePress 1.0 版本，并声称其 “基于 Vite 和 Vue 构建，是 VuePress 的精神继承者和现代替代品。” VitePress 是一个静态站点生成器 (SSG)，专为构建快速、以内容为中心的站点而设计。 简而言之，VitePress 获取用 Markdown 编写的内容，对其应用主题，并生成可以轻松部署到任何地方的静态 HTML 页面。 主题和支持VitePress 附带一个用于技术文档的默认主题，为 Vite、Rollup、Pinia、VueUse、Vitest、D3、UnoCSS、Iconify 等提供支持。 且 Vue.js 官方文档也是基于 VitePress 的。但是为了可以在不同的翻译文档之间切换，它自定义了自己的主题。
55620编辑于 2024-03-25 - 来自专栏前端lucio
基于目录为VitePress生成侧边栏
---- 今天封装了一个用于自动生成VitePress 侧边栏的npm包，分享一下，求求帮忙Star。 github vitepress-plugin-autobar 这应该是目前最简洁好用的生成VitePress 侧边栏的工具了。 VitePress VitePress 是基于 Vite构建的文档网站框架，是 VuePress 的升级版本。 Vue3的文档就是用VitePress搭建的。 安装 npm install -D vitepress-plugin-autobar 使用 import { getSideBar } from 'vitepress-plugin-autobar' 的侧边栏配置 下一步计划 如果未来VitePress支持插件，将通过插件的形式，提供自动生成侧边栏的支持。
1.7K10编辑于 2023-04-22 - 来自专栏与前端沾边
使用 vitepress + github Pages搭建自己的博客网站
cd blog-vitepress 初始化 package.json, 安装 vitepress npm init -y npm i -D vitepress 将 vitepress 执行命令添加到执行脚本中 "scripts": { "dev": "vitepress dev docs --open", "build": "vitepress build docs", "serve": "vitepress 创建一个配置文件，在docs中新建一个 .vitepress 文件夹，里面创建一个 config.js 文件 // vitepress/config.js module.exports = { title 中注入脚本，执行脚本自动生成在 docs/.vitepress/theme 目录下 "scripts": { "register:components": "vitepress-rc" } 执行 npm run register:components // docs/.vitepress/theme/index.ts // 导入vitepress-theme-demoblock主题，并注册组件
4K50编辑于 2021-12-06 - 来自专栏前端博客
algolia配置站内搜索：vitepress配置示范
m=search&c=index&a=init&siteid=1&typeid=1&ajax=1&q=JavaScript但是，vitepress的主题，不想定制，第二个，他集成了Algolia，所以还是研究下其配置 Keys获得：algolia: applicationID: 你的APPID apiKey: 你的API Key indexName: 你的Index名字 chunkSize: 5000配置vitepress Algolia然后在docs/.vitepress/config.js{ themeConfig: { algolia: { appId: 'your id' - 邻家枫扬的回答 - 知乎 https://www.zhihu.com/question/46822587/answer/308411949转载本站文章《algolia配置站内搜索：vitepress
1.7K30编辑于 2023-06-06 - 来自专栏大前端全栈开发
用vitepress搭建文档网站踩坑记录
之前用 vuepress2 + vite 成功搭建了一个博客网站，这不 vue3 的文档改用 vitepress 搭建的，看着挺好看的，就想着也来折腾折腾搭建一个工作的文档网站。 配置目录名叫 .vitepress注意不要走错频道了，这不是 vuepress 的片场，刚开始我就新建成了 .vuepress，配置了半天导航、侧边栏咋就是没效果呢，明明跟 Getting Started vitepress 这个目录要放在 docs 目录下刚开始我就直接放在了根目录下，和 docs 目录平级，怎么改都不起作用，最后才发现是要放在 docs 目录下面的。 这一点 vitepress 官方文档里的版本迁移 Migration from VitePress 0.x 里其实已经有说明。 ./.vitepress/dist。
60520编辑于 2023-11-16 - 来自专栏dmhsq_csdn_blog
vitepress 打包时Cannot use import statement outside a module
vitepress 打包碰到的问题 Cannot use import statement outside a module 去翻了下github https://github.com/vuejs /vitepress/issues/476 有些包可能不支持esm或者无cjs导出类型 改用动态引入 如 import gsap from 'gsap'; 改为 const initGsap =
54930编辑于 2023-09-23 - 来自专栏小鑫同学编程历险记
搞一搞明白Vitepress的文档渲染基础
Vitepress的文档渲染目的就是将程序员日常所写的Markdown文件编译为Html文件，并添加了更多的插件来丰富MD文件的功能，就比如说Vuejs组件在MD文件中渲染等等，为了我们可以在使用Vitepress 的时候可以更随心所欲的定制一些功能，我们要先搞一搞明白Vitepress是如何将MD文档渲染成HTML的~ 看完可以明白这3点？ 总结 通过使用markdown-it、highlight.js、markdown-it-container模块实现了Markdown到HTML的文档转换，代码块高亮和自定义容器，VItepress搭建的组件库文档中的组件渲染和源码展示功能就需要用到自定义容器的解析和组装自定义的
1.8K30编辑于 2022-12-26 - 来自专栏跟牛老师一起学WEBGIS
vitepress+gitee pages搭建自己的博客网站
本文就带你通过vitepress和gitee pages搭建一个属于自己的博客网站。 操作 1、搭建vitepress工程 1. 先在gitee上创建一个工程 2. dev docs", "build": "vitepress build docs", "serve": "vitepress serve docs" }, "directories 此时已完成vitepress工程的初始化。 2. 创建博客 1. 打包工程 运行命令npm run build打包，打包后的文件位于在docs/.vitepress/dist。上传代码和打包资源到gitee`。 2. 发布博客 点击”服务->Gitee Pages” 选择要发布的分支，并输入部署目录docs/.vitepress/dist，点击”启动”按钮开启。
2.1K10编辑于 2022-12-19 - 来自专栏大前端全栈开发
用vitepress搭建文档网站踩坑记录
之前用 vuepress2 + vite 成功搭建了一个博客网站，这不 vue3 的文档改用 vitepress 搭建的，看着挺好看的，就想着也来折腾折腾搭建一个工作的文档网站。 配置目录名叫 .vitepress 注意不要走错频道了，这不是 vuepress 的片场，刚开始我就新建成了 .vuepress，配置了半天导航、侧边栏咋就是没效果呢，明明跟 Getting Started .vitepress 这个目录要放在 docs 目录下 刚开始我就直接放在了根目录下，和 docs 目录平级，怎么改都不起作用，最后才发现是要放在 docs 目录下面的。 这一点 vitepress 官方文档里的版本迁移 Migration from VitePress 0.x 里其实已经有说明。 ./.vitepress/dist。
71910编辑于 2023-11-18 - 来自专栏后段开发
腾讯云部署vitepress，高颜值文档博客
https://vitepress.dev/先看两张效果图。图片图片一定要用这个官网，之前看了一个翻译版本，好像翻了一半不弄了，坑了半天时间也解决不了。目前看起来还没有官翻。 安装node这个教程比较多了，就不再细说了安装vitepress依赖mkdir viteblog // 新建博客目录npm init // 新建node环境npm install -D vitepress // 安装vitepressnpx vitepress init // 安装向导本教程使用的配置如下：图片默认的文档及编译后静态文件产出都存放到 docs 下边。 /docs/.vitepress/dist以下是一个当前使用中的例子，有兴趣可以看一下。https://www.xyccstudio.cn/books/
1.4K20编辑于 2023-07-07 - 来自专栏农民工前端
【保姆级教程】如何创建一个vitepress项目？
mkdir vitepress-starter && cd vitepress-starter 初始化文件 （看习惯，如果有该习惯就初始化，没有可跳过） 官网默认使用了 yarn 作为依赖管理工具 # add -D vitepress # 用pnpm pnpm add -D vitepress # 用npm npm add -D vitepress 如果下载失败，可以使用以下方法： npm add 这不会影响 VitePress 运行。 通过运行以下命令启动向导： # 用yarn yarn vitepress init # 用pnpm pnpm vitepress init # 用npm npx vitepress init 将需要回答几个简单的问题 ： ┌ Welcome to VitePress!
43310编辑于 2024-09-13 - 来自专栏前端开疆扩土之路
十分钟用vitepress搭建项目文档
写了一篇技术文章，Vue3项目框架搭建封装，一次学习，终身受益【万字长文，满满干货】，可惜掘金给的流量不多，点赞的人不多，评论的人几乎没有，收藏的人却不少，我想可能是万字长文看起来太吃力，于是花了3天时间用vitepress 文档地址：yinzhuo19970516.github.io/ 现在，我准备花10min介绍一下,介绍一下这个vuepress的小兄弟，vitepress vitepress是什么 vitepress 是一款基于vite vue3的静态站点生成器 有什么问题看文档吧，推荐看英文文档，中文文档不全 遇到问题建议去github gitee 搜索，目前这类的博客比较少 英文文档 中文文档 vitepress ": { "dev": "vitepress dev docs --open", "build": "vitepress build docs", "serve": "vitepress serve docs" }, 运行 npm run dev 最基础的搭建就成功了 加配置文件 在docs目录下创建一个 .vuepress目录，如下结构 . ├─ docs │ ├─ .vitepress
1.5K31编辑于 2022-09-21 - 来自专栏iSharkFly
VitePress 项目部署 cloudflare page 提示 Node 构建错误
Continuing.09:35:26.253Detected the following tools from environment: yarn@3.6.3, nodejs@18.17.1因此解决办法就是针对 VitePress
34200编辑于 2025-04-11 - 来自专栏编程技巧
简单使用vitepress快速搭建一个文档网站
VitePress 是一个静态站点生成器 (SSG)，类似的项目有docsify、VuePress、hexo。 VitePress 附带一个专为技术文档设计的默认主题。 VitePress 和 VuePress类似的一个项目。最初的 VuePress 基于 Vue 2 和 webpack。 这里使用插件vitepress-i18n来完成这个功能。## 安装插件pnpm add -D vitepress-i18n修改docs/.vitepress/config.js文件。 具体的内容可以参考vitepress官方文档。
83810编辑于 2024-09-29 VitePress不能展示PDF？这个小技巧让你轻松解决！
今天，我要和大家分享一个关于VitePress的小技巧。你是否曾经在使用VitePress时遇到过无法展示PDF的问题？别担心，我这里有一个简单的解决方案，让你轻松解决这个问题。 问题的根源要明确一点，VitePress不能展示PDF的原因是在build打包时，除图像、媒体和字体文件外的静态资源要放在public下。 这是因为VitePress默认将静态资源放在public目录下，而PDF文件并不在这个范围内，所以在构建时会出现问题。解决方案那么，如何解决这个问题呢？ 使用配置文件除了使用插件，还可以通过修改VitePress的配置文件来解决这个问题。可以在vite.config.js文件中添加以下代码：export default { // ... 结论通过以上两种方法，可以轻松地解决VitePress不能展示PDF的问题。希望这篇文章能够帮助到你，如果你有任何疑问或者建议，欢迎在评论区留言。
82110编辑于 2024-06-03- 来自专栏iSharkFly
VitePress 项目部署 cloudflare page 提示 npm run build 错误
Exited with error code: 1问题和解决上面的问题是在执行构建的时候 VitePress 的构建命令不是 npm run build。
41800编辑于 2025-04-11
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号