title: 使用docusaurus快速搭建静态博客站点 description: 使用docusaurus快速搭建静态博客站点 slug: use-docusaurus-to-deploy-blog...Blog url: https://walrus.net.cn image_url: img/walrus.jpgundefined Docusaurus是一种静态站点生成器。...npx create-docusaurus@latest website-demo classic 上述命令执行完成后，website-demo/目录下会看到下面被生成的文件： ├── babel.config.js...切换到浏览器，可以看到默认的列表页已经可以看到刚才新增的博客，如下图所示： [03.png] 第四步：发布博客站点 本地启动的只是开发服务器，一般只建议在开发环境使用它。...在发布站点之前，需要先打包，执行如下命令： yarn build 打包完毕后，可以在.
VuePress 和 Docusaurus 都是非常流行的开源静态站点生成器，特别适用于构建技术文档和知识库。它们都提供了美观的预设主题、易于使用的Markdown语法支持以及自动生成的导航和侧边栏。...简介 VuePress 是由 Vue.js作者尤雨溪开发的一个轻量级静态网站生成器，它利用 Vue.js 的组件系统和 Markdown 渲染来创建文档站点。2....Docusaurus1. 简介 Docusaurus 是 Facebook开发的静态站点生成器，主要用于构建开源项目的文档网站。2....重新构建你的 Docusaurus 站点以应用更改：yarn build现在，你的 Docusaurus 站点应该已经有了一个功能完善的搜索框，由 Algolia 提供支持。...大多数情况下，你可以通过配置现有的插件或主题来达到目的。自定义Docusaurus主题尽管直接修改现有主题的JavaScript和CSS文件也是一种方式，但推荐的做法是继承现有主题并覆盖所需部分。
与 Pelican 一起工作时，您无需担心数据库或服务器端编程问题。Pelican 可以生成静态的网站内容，并可以通过任何 Web 服务器或托管服务对外发布。...采用 PWA Offline-first 架构，在离线情况下也能实现快速切换页面而无需重新加载的体验。...middleman/middleman[6] Stars: 7.0k License: MIT Middleman 是一个静态站点生成器，使用现代 WEB 开发的所有快捷方式和工具。...简单易用：与其他复杂且使用困难的静态网页生成器不同，Publii 提供了一种类似于 WordPress 或 Joomla！这样基于服务器 CMS 的简单易懂界面。...只需几分钟即可完成整个建立过程；由于 Pubii 是一个桌面应用程序，在没有网络连接时仍然可以离线创建更新修改你想要展示到互联网中的信息。
服务器使用宝塔面板出现“您的请求在web服务器中没有找到对应的站点!”的解决办法 服务器使用宝塔面板出现“您的请求在web服务器中没有找到对应的站点!”...的解决办法 近期经常看到有站长朋友反应服务器出现以下报错： QQ图片20180720152852.png 这个提示是说您访问的域名，在这台服务器上没有找到对应的站点，其实就是配置文件没有正确读取才出现的...如果第一种方法无效的话，采用第二条方式 2.连接进入linux服务器SSH终端，输入以下命令： /etc/init.d/httpd stop pkill -9 httpd /etc/init.d/httpd...start 这三条命令在SSH中逐个输入，每输入一条就回车执行一次。...然后重启服务器，再查看效果。
什么是Docusaurus？ Docusaurus是Facebook开发的一个静态网站生成器，专注于构建优美的文档网站。它基于React，设计初衷是为开源项目提供一个高效、简洁的文档解决方案。...VuePress支持Vue组件，可以在Markdown中直接使用Vue的功能，适合熟悉Vue生态的开发者。 3....性能和SEO Docusaurus Docusaurus生成的静态网站性能优越，加载速度快。...此外，Docusaurus默认优化了SEO，可以自动生成站点地图和RSS feed，并且提供丰富的SEO配置选项。...这些网站界面简洁、功能完善，体现了Docusaurus在大型项目中的应用优势。
大半年没更新博客，一直忙着写项目（写到手软的那种），然后无意间在 B 站看到一个 Up 主 峰华前端工程师 基于 React 驱动的静态网站生成器搭建的个人博客。...第一眼看到该站点的时候惊艳到我了，于是也想着搭建一个，作为个人站点使用。 不过国内 docusaurus 的使用者是真的少。Vuepress 都快烂大街了......关于主题魔改可以看 Docusaurus 主题魔改 安装 下载代码，根据相应命令运行即可，在本地运行还是相对比较容易的。 修改了下个人信息，然后将之前的博客文章迁移过来即可。...额外功能页面 归档页 网址导航 评论 相关文章: Docusaurus 配置 Gitalk 评论插件 项目 部署 由于我是有个人的域名和服务器，所以之前部署项目都是直接将编译后的文件直接上传至服务器上...最后 我个人是比较满意该博客的，搜索，SEO，暗黑模式，博客列表，没有其他博客系统那么花里胡哨的，该有的整洁都有了，最主要是我个人不喜欢文章配背景图，尤其是那种与文章毫不相干的图，图片也许能减少阅读疲倦感
本文将介绍最流行的十大博客静态站点生成工具，以 Github star 数来排名。 1.Next.js star 数 100K+。...Next.js 是一个基于 React 框架的服务端渲染应用框架，它提供了许多功能，包括静态网站生成、服务器端渲染和动态网站生成等。...Docsify是一个轻量级的JavaScript文档网站生成器，使用Markdown文本文件来生成静态站点。相比于其他静态网站生成器，Docsify的特点是使用简单、易于配置和高度可定制。...部署简单，可以将生成的HTML静态页面部署到任何Web服务器上。 使用 MkDocs，您可以快速创建漂亮的文档页面，非常适合技术写作、软件文档、项目文档等。...本文列出了最受欢迎的 Top20 博客静态站点生成工具，它们在 GitHub 上的 star 数可以直接反映它们的受欢迎程度。
来搭建，代码在Github，所以想把Github Page利用起来； 又因为采用monorepo子包的方式维护，看了下社区没有相关部署姿势，就写了这么一篇； 效果图 Github Action 执行过程...来维护，如图 需要解决问题 因为我们把文档做成一个monorepo 子包来维护了，所以对应的产物也在包内； 常规的Github Page只能读取工程根目录或者根目录下的docs文件夹，此时就没法直接通用了...，如下图所示； 翻了翻【docusaurus deployment】官方的部署文档的指南，发现并没有针对monorepo的指导； 但是办法总比困难多，知道了Github Page的部署机制，其实就有法子绕过去了...； gh-pages: 是github官方默认推荐的静态站点存放分支 文档入口默认读取根目录 结合这两点，我们可以利用Github Action来帮我们实现这个需求！...就是github 生成page主域） baseUrl是工程的入口网页的寻址路径 Github Workflow name: Deploy to GitHub Pages on: push:
就是一条龙服务，只要你有一套网页代码，无论是静态、动态网站还是其他类型的 web 应用，都能使用 Webify 傻瓜式部署。...可以自己写代码；也可以直接使用一些现成的站点生成器，比如 Hugo、Hexo 等（后面详细介绍），自动生成源代码；当然还可以下载、克隆别人的项目代码。...比如我们要做个人博客，可以选择 Docusaurus 2 这款主流的站点生成器： ? 选中模板后，系统会自动把代码模板复制到新的 Git 仓库，和应用关联。 ?...其实在部署过程中，系统会自动创建一个 云开发 环境，根据配置的命令自动构建项目，将构建产物放到 静态网站托管 上。 可以在云开发控制台看到已经上传到服务器上的文件： ?...后面大家可以参考 Docusaurus 站点生成器的官方文档，更改代码和配置，进一步定制自己的博客。
关于创建博客的一个误区是，你需要成为一名伟大的作家才能获得成功。没有东西会离事实很远。人们阅读博客网站以获得对事物的个人观点，因此大多数博主都以非正式和会话的方式撰写。...只需使用Markdown 和Docusaurus 撰写文档和博客文章，就会发布一组准备服务的静态html文件。 Reat生成-通过重用React来扩展或自定义项目的布局。...在重复使用相同的页眉和页脚时，可以扩展Docusaurus。 本地化已 预先配置。使用Crowdin将您的文档翻译成70多种语言。 让您的社区轻松找到他们在文档中所需的内容。...HUGO 官方地址: https://hexo.io/ 背书: 撰写文章此时github星数: 35195 Hugo是最受欢迎的开源静态站点生成器之一。...以阿里云为例，独享经济型虚拟空间：298/年，对于大部分博客用户是足够使用的。 Docusaurus/HUGO：因为采用Node.js和Go实现，所以虚拟空间是没有希望了。
在现代化软件开发中，文档对于软件成功的重要性不言而喻。然而，管理和维护文档站点往往会给开发者带来额外的负担。为了帮助开发人员快速构建易于管理和维护的文档站点，Docusaurus应运而生。...Docusaurus是一款基于React的开源文档站点生成器，它可以帮助开发者快速构建出现代化、易于维护的文档网站。...Docusaurus是由Facebook开发的，最初是为React Native文档而创建的。现在，Docusaurus已经成为开发者在创建和维护文档站点时的首选工具之一。...总结 Docusaurus是一个优秀的文档站点生成器，它的可定制性、易用性和丰富的插件和工具，使得开发人员可以更轻松地创建、管理和维护文档站点。...如果您正在寻找一种易于使用和可定制的文档站点生成器，那么Docusaurus是一个不错的选择。它的灵活性和丰富的功能使得它成为许多开发人员和组织的首选。
就是一条龙服务，只要你有一套网页代码，无论是静态、动态网站还是其他类型的 web 应用，都能使用 Webify 傻瓜式部署。...可以自己写代码；也可以直接使用一些现成的站点生成器，比如 Hugo、Hexo 等（后面详细介绍），自动生成源代码；当然还可以下载、克隆别人的项目代码。...比如我们要做个人博客，可以选择 Docusaurus 2 这款主流的站点生成器： [从模板创建] 选中模板后，系统会自动把代码模板复制到新的 Git 仓库，和应用关联。...可以在云开发控制台看到已经上传到服务器上的文件： [image-20210725113052670.png] 在静态网站托管页面，可以修改已上传的文件，修改 CDN 缓存设置等： [修改 CDN 加速配置...后面大家可以参考 Docusaurus 站点生成器的官方文档，更改代码和配置，进一步定制自己的博客。
前 言 我的这个博客站点大约始建于2010年以前，使用过 dlog、pjblog、zblog 等博客程序，也手动建立使用过纯静态 HTML 页面，大约2010年开始使用 WordPress。...每次在网易云笔记里写好 markdown 格式的文章，然后复制到本地电脑 hexo 的对应目录下，手动生成新的网站静态页面。最后再手动上传到服务器空间里，这样就完成了网站的更新。...第一，一定要使用我安装配置了 hexo 的那台电脑，才能发布生成新的静态页面，然后才能更新到服务器。...第二个问题，其实是第一个问题的延伸。每次发布新文章，文章写好以后，还需要复制到 hexo 目录下，手动生成静态页面，然后上传到网站服务器，这个过程太过繁琐。...在自己的 GitHub 仓库里修改网站，或者拟写 markdown 格式的日志，webify 会自动构建和部署，生成新的静态页面并发布。
功能强大，与 Gatsby 相似（React）dumi - 一款 UmiJS 生态中的组件开发文档工具（React）Nextra - 一个基于 Next.js 的静态站点生成器。...一个只有几页的简单文档站点启动开发服务器所花费的时间变得难以忍受。即使是 HMR 更新也可能需要几秒钟才能反映在浏览器中。...Vite 的出现很好地解决了这些问题：近乎即时的服务器启动、仅编译所服务页面的按需编译以及闪电般快速的 HMR。 VuePress v1 在本质上是一个 Webpack 应用程序。...有了 Vite 和 Vue 3，真的是时候从新考虑“Vue 驱动的静态站点生成器（vue系列的说明文档几乎都是这样生成的）创建博客：mkdir blog-vitepresscd blog-vitepressnpm...例如，若是您计划将站点部署到https://foo.github.io/bar/，则应将base设置为“/bar/”（始终以斜杠开头和结尾）。
快速搭建一个react个人静态博客网站，并使用vercel免费部署发布到线上# 首先看下成果图： 本篇你将您学到： 1 如何快速搭建一个自己的博客网站，可以在这个网站里面上传自己的博客、撰写自己的文档...（正常我们要买域名、服务器才能，而这里不需要，当然免费的话网就有点慢了，后面也可以自己搞一个域名服务器发布） 博客框架： docusaurus，快速构建一个静态网站。...官方文档：https://docusaurus.io/zh-CN/ 网站UI及源码参考： 峰华前端工程师个人博客：https://zxuqian.cn/ （已联系过峰华大佬，再次感谢峰华大佬，可以让我在他的源码基础上再进行创作...关于docusaurus的讲解，可以看峰华的视频，有讲解，本篇不再赘述。...【JAMSTACK】使用 Docusaurus 静态网站生成器搭建个人博客：https://www.bilibili.com/video/BV1uE411x7mE 【JAMSTACK】部署 Docusaurus
亲爱的CodeIdea读者朋友们，欢迎来到这场开源API文档工具的终极对决。在软件开发的世界里，好的文档是不可或缺的，而选择适合您的API文档工具可能是一个关键决策。...在本文中，我们将深入比较两款热门的开源API文档工具：VuePress和Docusaurus。 为什么选择API文档工具？ 在软件开发中，好的API文档对于开发人员、团队协作和项目的成功至关重要。...VuePress：轻松上手的静态网站生成器 VuePress简介 VuePress是一个由Vue.js提供支持的静态网站生成器，它被广泛用于创建文档网站。...快速生成：由于是静态网站生成器，VuePress生成的文档非常快速，适用于快速查阅和搜索。 SEO友好：VuePress具有出色的SEO性能，可确保您的文档在搜索引擎中获得良好的排名。...无论您选择哪个工具，都要确保为您的API编写清晰、详实和易于理解的文档，以便开发人员能够轻松使用和理解您的API。
在浏览器中手动完成的大多数事情都可以通过使用 Puppeteer 完成，如生成屏幕截图和 PDF 页面、检索 SPA 并生成预渲染内容（即“SSR”）、从网站上爬取内容等 九、静态网站建站工具 Docusaurus...Docusaurus 是 Facebook 专门为开源项目开发者提供的一款易于维护的静态网站创建工具，使用 Markdown 即可更新网站。...构建一个带有主页、文档、API、帮助以及博客页面的静态网站，只需5分钟。 ● 启动简单 ：Docusaurus的构建可以在很短的时间内启动和运行。...● Node 支持：可在服务器上运行，或者运行在 IoT 的 Arduino 上 ● 开放的 rAF loop：可以在核心 requestAnimationFrame 循环里运行任何进程 十一、JavaScript...● Batteries-included：开箱即用，HyperApp 具有类 Elm 的状态管理和虚拟 DOM 引擎；但它仍然只有 1kb 的大小，没有依赖关系。
当我们没有展开它的目录时，XPath只能提取到当前大标题的链接，如下图所示： 当我们点开了某个大标题，让里面的小标题出现时，XPath能够提取的数据会随之变化，如下图所示： 在这种情况下，我们经常使用的爬虫方案...，都会遇到阻碍： 直接使用Requests获取源代码——源代码里面没有每条目录的URL 使用Selenium——直接执行XPath获取不完整。...然后你会发现，目录每一项的URL是在一个js文件中的： Docusaurus还比较简单。...它的URL是分散在很多JS文件中的，解析起来非常麻烦。 遇到这种网站怎么快速获取目录页的所有URL呢？其实不需要使用任何高级工具就能解决。...，所以理论上所有使用Docusaurus生成的文档，都可以通过这个方法获得所有文档页面的URL。
在前端开发中，有一些流行的UI文档框架可供选择。这些框架可以帮助开发人员创建和维护易于理解和使用的UI文档，以便团队成员和利益相关者可以更好地理解和合作开发项目。...图片https://www.docz.site/#DocusaurusDocusaurus 是一个用于创建、维护和部署静态网站的工具。它适用于创建项目文档、团队文档和任何其他类型的文档。...Docusaurus 集成了 Markdown、React 和一些自定义配置选项，可以帮助开发人员快速创建漂亮的文档网站。...the modern SSG framework you've always wanted.图片https://vitepress.dev/#VuePressVuePress 是一个基于 Vue.js 的静态网站生成器...idoc 使用 Markdown 解析文章，在几秒内，即可利用默认主题生成静态网页。
介绍 Jekyll是一个静态站点生成器，它有内容管理系统（CMS）的一些优点，同时避免了此类数据库驱动的站点引入的性能和安全问题。...在本教程中，我们将在Ubuntu 16.04上安装一个Jekyll 3.7.3开发站点。在后面的教程中，我们将探索此处生成的内容，将静态站点发布到同一服务器，并最终部署到生产位置。...的Web服务器 Jekyll内置的轻量级Web服务器专为支持站点开发而定制，它通过监视目录中的文件并在保存更改时自动重新生成静态站点。...如果您正在使用本地计算机，则可以在 没有主机设置的情况下运行jekyll serve并连接http://localhost:4000。...在Web浏览器中，我们可以在jekyll serve输出中显示的服务器地址和端口访问它： 结论 在本教程中，我们安装了Jekyll并创建了一个包含一些自动生成内容的开发站点。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
云直播
