文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何构建自己的技术博客

本文相关知识点： markdown Vuepress/vitepress GitHub pages 托管服务 为什么建议搭建个人博客网站 拥有自己的技术博客，不仅可以提升自己的技术能力，还可以提升自己的影响力...路由会根据你的 markdown 文件的相对目录来自动生成。每个 markdown 文件都通过 markdown-it 编译为 html，然后将其作为 vue 组件的模板。...VuePress 内置了基于 headers 的搜索 —— 它会自动为所有页面的标题、h2 和 h3 构建起一个简单的搜索索引。...在 VuePress 中，目前自带了一个默认的主题（正是你现在所看到的），它是为技术文档而设计的。...，默认采用页面中的标题 侧边栏同样可以分组，但需要按照指定文件结构 . ├─ README.md ├─ contact.md ├─ about.md └─ vue/ ├─ READMEvue

23530

开发工具总结（15）之Vuepress制作文档并发布到GitHub

guide/', '标题2'] ], } } 书写规则： 省略·.md扩展名，以/结尾的相当于*/README.md，如果未显示地指定链接的文字，会自动引用md文件的H1标记后面的文字作为标题...当用户通过滚动查看页面的不同部分时，嵌套的标题链接和 URL 中的 Hash 值会实时更新，这个行为可以通过以下的配置来禁用：（一般用默认的就可以，不做修改。）.../MyDocs", // 是否编辑链接 editLinks: true, // 编辑链接文字 editLinkText: "在 GitHub 上编辑此页", /...label 标签 label: '简体中文', // github 编辑链接的文字 editLinkText: '在 GitHub 上编辑此页',...（8） Git 仓库和编辑链接 当你提供了 themeConfig.repo 选项，将会自动在每个页面的导航栏生成生成一个 GitHub 链接，以及在页面的底部生成一个 "Edit this page"

3.9K50
您找到你想要的搜索结果了吗？
是的
没有找到

手把手教你用vuepress搭建自己的网站(2)

这是因为vuepress默认打开的是docs 下的README.md文件, 由于你没有创建,所以找到的是vuepress 默认提供的404页面 文件的相对路径 页面路由地址 /README.md /...当然,您现在看到的页面是一片空白,那是因为docs根目录下的README.md中没有任何内容,但现在至少不是 404 了,离曙光又近了一步 设置封面启动页 有时候,当别人进入您的网站时,设置一个启动页...,在您以后用 md 写文章时,同样引入图片时,图片的后缀名都不能带有中文字符 配置导航栏 导航栏中有页面标题、搜索框、 导航栏链接、多语言切换、仓库链接，它们都是可以直接通过配置出来的,在 config.js...默认的深度是 1，它将提取到h2的标题，设置成 0 将会禁用标题（headers）链接，同时，最大的深度为 2，它将同时提取h2 和h3 标题,如果想要额外拓展,支持h1~h6,在 markdown 配置拓展中...,当你新增nav,或者侧边栏时,nav与slidebar,会越来越长,会很难受 拆分-config 在拆分之前,你可以了解下CommonjS中模块化导入导出的规则就可以了,这里你只需要知道,在一个文件中导入一个文件使用

2.5K20

团队技术文档构建利器vuepress上手实践

# 全局安装 > yarn global add vuepress # 创建一个 markdown 文件，仅包含一个标题 > echo '# Hello VuePress' > README.md 编写文档...3.1.2 导航栏(navbar) themeConfig.nav 导航栏包括 左侧页面标题、搜索框、导航栏链接、多语言支持、仓库链接，支持下拉分组菜单，还支持在全局或单页面中禁用。...3.1.3 侧边栏(sidebar) themeConfig.sidebar 侧边栏一般用于文档的目录索引，可以直接在 config.js 中配置链接数组，也在页面中配置 sidebar:auto 自动生成侧边栏目录...3.1.7 上一页 / 下一页链接(prev / next links) 可以在每个页面设置上下页链接。...module.exports = { base: '/test/' } 可以在项目中创建 deploy.sh 文件，方便在持续集成的设置中在每次 push 代码时自动运行脚本。 #!

1.3K20

docsify部署及配置

README.md：默认展示的首页就是 README.md 里的内容。 .nojekyll：用于阻止 GitHub Pages 会忽略掉下划线开头的文件。...在本地编辑好文档，通过下面命令即可本地预览： docsify serve wiki 上传到Git 添加了文档之后，我将整个 wiki 文件夹上到了「 Gitee」，为什么选 Gitee 呢，当然是国内访问快而且免费了...为什么没用CDN 由于 docsify 搭建的 Wiki 都是源文件，不需要自己编译，所以完全可以把整个文档放到又拍云或者七牛云等 CDN 上，访问速度会更快。...auto2top: true, name 文档标题，显示在侧栏顶部。 name: '掘墓人的 Wiki', nameLink 点击文档标题后跳转的链接地址。...topMargin 让你的内容页在滚动到指定的锚点时，距离页面顶部有一定空间。 topMargin: 40, 设置之后，点击侧栏的二级标题之后，页面的标题不会距离顶部太近。

3K30

VuePress 入门

作为本地依赖安装让你可以使用持续集成工具，或者一些其他服务（比如 Netlify）来帮助你在每次提交代码时自动部署。...会自动将此分支代码部署到pages页面中）则删除，并将本地的master分支推到远程的gh-pages，在根目录下运行..../deploy.sh即可正确部署 注意： macos用户需要在运行脚本加权限，执行chmod +x deploy.sh 之后在github 页面的settings里就可以看到页面链接了 主页配置...可以写简单的配置就能渲染跟 Vue一样 的主页，只需在docs文件夹目录下创建一个README.md --- home: true // 为true则开启主页 # heroImage: hi //...text: '主页', link: '/'}, {text: '文档', link: '/guide/'}, // 根路径指docs目录，guide后面加一个 / 表示guide是一个目录，会自动读取其下的

49030

VuePress 搭建站点

项目的说明文档为例，创建 cellink-docs 文件夹 mkdir cellink-docs 初始化项目 npm init -y 在 VueDemo 文件夹中创建 docs 文件夹，在其中加入...在 docs 中创建 .vuepress 文件夹，在.vuepress中创建 public 文件夹和 config.js 文件，最终项目结构如下所示： VueDemo ├─── docs │ ├─...模块 npm install vue-template-compiler 配置站点信息 在 config.js 文件中配置网站标题、描述、主题等信息 module.exports = { locales...[](/imgs/adc-graph.png) 如果需要在 github 仓库中引用该图像，在前面加入仓库名称 !...npm run build 得到静态文件后可以推送到服务器、Github Pages 等进行站点托管 示例工程 上述 cellink-docs 工程文档链接：https://github.com/zywvvd

60810

ReStructuredText 文档编写全攻略编写文档说明

你肯定会猜测，为什么采用这种方式编写文档，一定存在什么优势？...我的思考结果如下： 标题 段落 文本标记 图片 表格 链接 上述6个部分几乎包括一篇的全部组成，所以学习 rst 语法也从这6个部分着手。...，先学会核心的这几个，遇到问题再针对性的查找： 比如：如何在文档内提供下载链接，点击链接就能进行下载 gitbook的使用 Gitbook 和 sphinx 有很多相似之处： 自动的生成文档 使用标记语言...:初始化书本的目录 gitbook init 生成两个文件： README.md SUMMARY.md 在 SUMMARY.md 文件中构造目录结构 比如创建两个章节： # Summary #...我比较喜欢 JetBrains 旗下的开发工具，几乎我要使用的IDE 都从其中进行选择，风格很相似，会一款了，其他的几乎都会用，而且支持的插件也很多，比如学习 markdown 标记语言，就有可是化插件

5.3K31

【硬核教程】只需1秒—你也可以有自己的API文档

我看的很多教程，都是在没有背景、没有代码、没有效果的情况就开始了。让本来希望通过这个教程入门的人懵上加懵（比如我）。 Github地址：-> 戳此 <- 墙裂建议，先拉下来看看效果。...并不是自动打开浏览器，需要手动进入本地项目地址 ? 首页 然后点开始开发会进入到如下的详细界面。 ? 详情 左边就是我们需要详细展示的文档，可以看到我简单的分了两类作为样例。...然后是详情页 可以看到，在首页的配置中，有一个actionLink，这个是指点了首页中的开始开发，需要跳转到的路由。这个就是我们众多详情中的其中一个页面的路由。 你可以对比刚刚详情页的图片。...在vuepress中，如果路由以/结尾，那么就是指的这个目录下的README.md文件 还有一点很方便的是，单个文件里如果你有二级标题，vuepress会自动的生成该文件下的二级标题导航。...点击相应的二级标题还可以直接跳转到对应的锚点，如下图。 ? 自动生成锚点 如果你还需要更多功能 如果你作为一个后端开发， 要想展示你的文档，其实我认为完全够了。

83510

【云+社区年度征文】用上神器docsify 靠MarkDown 就能写自己的网站

[6ce66ef84e2125753afc5255a372bf2b.png] docsify 是专业用来写文档的，配合 github 的在线托管，特别方便就可以使用 左边可以显示目录 和 每篇文档 自动生成小标题.../docs 直接编辑 docs/README.md 就能更新文档内容 预览效果 docsify serve docs 进阶使用内容 多页文档 官方文档 写了一两篇文章 发现 readme.md 这个文件越来越长...查官网是这么说的 如果需要创建多个页面，或者需要多级路由的网站，在 docsify 里也能很容易的实现。例如创建一个 guide.md 文件，那么对应的路由就是 /#/guide。...$docsify= { search: 'auto' } 官方文档 给出了 更完整的配置教程，能看懂就OK 全文搜索插件会根据当前页面上的超链接获取文档内容，在 localStorage 内建立文档索引...最后 访问我 在第一步里面说的 网址 浏览器访问就可以 看到 最后的效果了 访问的链接 就会是 你的名字.github.io/仓库名 比如我这个就是 HANXU2018.github.io/docs

1.2K20

利用 docsify 免费搭建自己的文档类型网站

账号； 快速安装并开始 安装 首先使用如下命令在自己的电脑上安装 docsify-cli 工具，方便后续的创建和预览自己的文档网站； npm i docsify-cli -g 项目初始化 在自己的电脑上创建一个项目文件夹...index.html : 入口文件，也叫配置文件，相关配置均在其中； README.md : 作为主页内容渲染； .nojekyll : 防止 Github Pages 忽略下划线开头的文件...； 本地预览 当我们编辑好文档后，想要在本地预览时，可通过如下命令运行本地服务器，然后在浏览器中访问 http://localhost:3000 进行实时预览（其中 3000 端口是 docsify...： 新建仓库 即和平常创建的步骤一样，但是要注意打开 Github Pages 功能； 提交项目 将本地的项目提交到远程； 预览 在浏览器中访问创建仓库时的给的网址即可在线预览我们的网站了，比如我的是...：https://cunyu1943.github.io/cunyu1943，默认会显示封面页； 总结 经过上述的配置之后，我们就成功利用 docsify 成功搭建自己的文档类型网站了。

2K20

软件教程 利用 docsify 免费搭建自己的文档类型网站

前言 在开始之前，请先确保你已经满足以下两个条件： 自己的电脑上安装了 Node.js ，如果还没有安装，可以参照我的另一篇教程 Node.js 的安装（多图版）； 拥有自己的 Github/Gitee...账号； 快速安装并开始 安装 首先使用如下命令在自己的电脑上安装 docsify-cli 工具，方便后续的创建和预览自己的文档网站； npm i docsify-cli -g ?...项目初始化 在自己的电脑上创建一个项目文件夹，比如我的是 Docsify，然后进入该文件夹并打开命令行工具，通过如下命令来初始化项目； docsify init ./ ?...，想要在本地预览时，可通过如下命令运行本地服务器，然后在浏览器中访问 http://localhost:3000 进行实时预览（其中 3000 端口是 docsify 默认访问端口）； docsify...预览 在浏览器中访问创建仓库时的给的网址即可在线预览我们的网站了，比如我的是：https://cunyu1943.github.io/cunyu1943，默认会显示封面页； ?

2K20

gitbook 入门教程之使用 gitbook-cli 开发电子书

$ sudo npm install -g gitbook-cli 关于安装配置相关问题请参考 环境要求 初始化 gitbook 项目 初始化项目,按照 gitbook 规范会自动创建...,并且大多数开发环境搭建在本地而不是远程服务器中,所以主要用于开发调试阶段...简单解释下各个文件的作用: README.md 是默认首页文件,相当于网站的首页 index.html ,一般是介绍文字或相关导航链接..... book.json 是配置文件,用于个性化调整 gitbook 的相关配置,如定义电子书的标题,封面,作者等信息.虽然是手动创建但一般是必选的....SUMMARY.md 概括文件[必须] 先停止本地服务,编辑章节目录结构,然后重新再初始化(gitbook init)自动创建相应目录.

2.6K30
点击加载更多

扫码

添加站长 进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

更多标签

活动推荐

    运营活动

    活动名称
    广告关闭

    腾讯云开发者

    扫码关注腾讯云开发者

    扫码关注腾讯云开发者

    领取腾讯云代金券

    热门产品

    热门推荐

    更多推荐

    Copyright © 2013 - 2024 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

    深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

    腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

    领券