首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

docsify」学习笔记

然后再次访问项目首页,即可发现: 这个时候我们就会发现,其实README.md文件的内容即是项目首页显示的内容,即在运行项目后,docsifyMarkdown文档README.md动态地转换成了网站的...多页文档 链接 链接可以让我们在网页之间进行跳转,如何在项目文件添加链接?...正如上文所说,docsify是把md文件动态地转换为html文件,那么我们只需要在md文件插入链接不就会自动地html呈现出来了吗?.../后端//) 如何在侧边栏显示md文件的二级标题、三级标题?...需要在设置添加: subMaxLevel: 2 // sidebar目录显示二级标题 自定义导航栏 开启导航栏需要在设置添加: loadNavbar: true 然后按照侧边栏_sidebar.md

71910

Markdown 语法

以上标记显示效果如下: 这段文字将会被高亮显示… 3 插入链接或图片 Markdown针对链接和图片的处理也比较简单,可以使用下面的语法进行标记 [点击跳转至百度](https://www.baidu.com...[logo](https://docsify.js.org/_media/icon.svg ':size=10%') 11 插入代码块 MarkdownIT圈子里面比较流行的一个重要原因是,它能够轻松漂亮地插入代码...英文模式下,找到键盘最左侧esc键下面的第一个键点击即可。 有人会问:如何在代码块打出 ``` 实际上是使用 4个` 包含 3个` 就可以了,想表示更多,最外层+1就好了。...Markdown,主要有以下几种特殊符号需要处理: \ 反斜线 ` 反引号 * 星号 _ 底线 {} 花括号 [] 方括号 () 括弧 # 井字号 + 加号 - 减号...注:在内容输入以上特殊符号的时候一定要注意转义,否则将导致内容显示不全,甚至排版混乱。 重要:MarkDown表格中使用竖线,如何做?

3.3K30
您找到你想要的搜索结果了吗?
是的
没有找到

用更优雅的方式写产品文档

你只需要创建一个 index.html 文件,并使用 Markdown 编写多个文档放在同一目录下,就可以自动搭建成一个小型的文档网站。...创建工作空间 Cloud Studio ,工作空间就是一个项目,我们的产品文档所有文件都存储在里面。...继续终端执行 docsify init ./docs 进行初始化,它会创建一个文档文件夹。此时文件目录中会多一个 docs 文件夹,我们就在这里面写文档。...我们打开右边的访问链接,将输入框的数字改成 3000,再点击右边的「创建连接」,在下方就会生成一条访问链接。你可以将鼠标放在二维码图表上来查看二维码并扫码访问,也可以直接点击蓝色的链接访问。...代码分支这里选择第二个选项,并点击「部署」按钮,即完成部署。 此时会返回到部署信息页面,等下面的部署信息显示成功之后,点击上面的链接,就可以看到我们的文档网站啦。

1.4K31

Docsify+腾讯云对象存储 COS,一键搭建云上静态博客

效果预览 http://docsify-1252452803.file.myqcloud.com/ 本文使用到工具 腾讯云对象存储 COSBrowser 客户端 Docsify 一颗能够写 markdown...前期准备工作 第一步 首先,你要在腾讯云对象存储控制台创建一个存储桶。这里作为例子,我创建一个名为 docsify 的存储桶。地域可以就近选择,访问权限要选公有读私有写。...点击上传按钮,选择链接文件上传,并将下列 url 文件资源复制到输入框,然后点击上传。...注意这里能够进行实时预览的链接为静态网站访问链接,不是加速域名链接。 每次编辑完后刷新浏览器页面就能实时看到更新后的文档内容。...您可以使用其他工具的快捷键屏幕里截图,截好的图会自动存在剪辑版。 当您在 COSBrowser 客户端用快捷键 CTRL+V 即可将截图上传到当前目录下。 3、如何在 .md 文档引用图片?

2.1K20

docsify,一款神奇的文档生成利器。

docsify 可以自动地将 Markdown 的标题生成目录,并且可以配合码云(国内的访问速度比 GitHub Pages 更快)快速搭建一个小型的文档网站,整个页面的配色和布局也十分舒适,让阅读体验不知不觉中提升了好几个档次...第二步,执行以下命令创建文档目录并初始化。 docsify init ....:文档标题,会显示侧边栏顶部。...保存后,就可以浏览器上查看到效果。 ? 05、安装插件 1)全文搜索 全文搜索插件会根据当前页面上的超链接获取文档内容, localStorage 内建立文档索引。... index.html 文件引入 docsify-copy-code 即可,如下所示: 复制代码 保存后,就可以浏览器上查看到效果。 ?

1.4K30

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

[6ce66ef84e2125753afc5255a372bf2b.png] docsify 是专业用来写文档的,配合 github 的在线托管,特别方便就可以使用 左边可以显示目录 和 每篇文档 自动生成小标题...,真的很难顶,不可能一个博客要是二三十偏文章 全都蜗居一个 markdown 里面吧。...查官网是这么说的 如果需要创建多个页面,或者需要多级路由的网站, docsify 里也能很容易的实现。例如创建一个 guide.md 文件,那么对应的路由就是 /#/guide。...的名字就行,访问这个页面就在地址栏之前的域名之后加入相对位置就行,学过 HTML 的老同志都懂 [53d18d69eed43b0f5f898b33d491e65f.png] 侧边栏定制显示层数 之前我说了...$docsify= { search: 'auto' } 官方文档 给出了 更完整的配置教程,能看懂就OK 全文搜索插件会根据当前页面上的超链接获取文档内容, localStorage 内建立文档索引

1.2K20

Docsify快速搭建个人博客

这将非常实用,如果只是需要快速的搭建一个小型的文档网站,或者不想因为生成的一堆 .html 文件“污染” commit 记录,只需要创建一个 index.html 就可以开始写文档而且直接部署 GitHub...docsify 中文文档:https://docsify.js.org/#/zh-cn/ 全局安装 安装脚手架工具 docsify-cli,安装过程较慢的可以切换 npm 源为 cnpm $ npm...i docsify-cli -g Github 创建你的 Blog 项目 如果你正在用 Markdown 写一些 Blog 项目,那么也可以用你现在的项目,如果你没有,那么建议你 Github 新建一个属于你的...HTML 里设置,但是链接要以 #/ 开头,另外一种通过 Markdown 配置导航,我们这里用的也是后者 首先配置 loadNavbar:true,之后创建 docs/_navbar.md文件. docs...总结 看完本篇文章,如果你还没有用过 Docsify,希望你能亲自实践下,可以用 Docsify 来建立自己的个人博客,我写作《Node.js 技术栈》过程,当内容多了之后,对于文档的在线预览功能最终也选择了

1.4K20

Typora+Docsify快速入门

因简洁、高效、易读、易写,Markdown被大量使用,Github、Wikipedia等网站,各大博客平台:WordPress、Drupal、简书、掘金等。...Markdown 基本语法 使用Typora之前首先你的先熟悉一下Markdown的基本语法,这样你用起Typora才能更加顺手、写起文章来更加快。...Markdown 官方教程 Docsify使用指南 Docsify使用指南(打造最强、最轻量级的个人&团队文档) Typora快捷键的使用 使用快捷键能够提高我们的开发,编辑效率,因此对于工具的快捷键灵活操作而言是十分重要的...Typora配置图片保证Docsify能够正常访问 一般情况下为了保证项目中的图片在不同的平台中都能够正常的访问到,我们通常都是使用相对路径去存储,因此Typora我们需要设置图片保存的路径为当前项目的指定文件夹下...Typora可以直接通过Ctrl+V将图片复制保存到指定的项目文件夹位置,使用相对路径可访问!

1K20

博客生成静态站点工具 Top 20

Docsify的主要特点包括: 基于MarkdownDocsify使用Markdown作为输入,这意味着您可以使用简单的标记语言来编写文档。...无需构建:Docsify不需要构建,您只需要在网站根目录下创建一个index.html文件并使用Docsify即可。 总之,Docsify 是一个非常适合快速创建文档和技术博客的工具。...如果您只是需要一个快速而简单的工具来创建文档网站,那么 Docsify 是一个不错的选择。但如果您需要更复杂的功能或更高级的定制,那么可能需要考虑其他工具, Hugo、Jekyll 等。...Sphinx 是一个用于创建技术文档的工具,可以将文本文件(reStructuredText、Markdown等)转换成HTML、PDF、EPUB等格式。...这些工具的大多数都支持 Markdown 等轻量级格式,并提供了许多主题和插件,可以方便地创建漂亮的博客。此外,这些工具也有很好的文档和社区支持,使得学习和使用它们变得更加容易。

3.1K21

几分钟上线一个项目文档网站,这款开源神器实在太香了!

$docsify = { coverpage: true } 然后创建_coverpage.md文件,添加如下配置即可; !...全文搜索 如果你想实现全文搜索功能的话,可以index.html添加搜索插件配置; window....代码高亮 如果你想实现代码高亮显示的话,可以index.html添加代码高亮的插件; <script src="//cdn.jsdelivr.net/npm/prismjs@1/components...时,我们需要把<em>Markdown</em>文件编译成html才能部署,使用<em>Docsify</em>我们无需编译,只需把docs<em>中</em>的文档都拷贝到Nginx的html目录<em>中</em>即可; 此时我们启动Nginx,访问下Nginx服务路径即可查看文档...另外<em>Docsify</em>除了一些插件配置,其他配置基本可以使用<em>Markdown</em>来完成,感兴趣的小伙伴不妨尝试下它!

1.7K20

入坑 docsify,一款神奇的文档生成利器!

docsify 可以自动地将 Markdown 的标题生成目录,并且可以配合码云(国内的访问速度比 GitHub Pages 更快)快速搭建一个小型的文档网站,整个页面的配色和布局也十分舒适,让阅读体验不知不觉中提升了好几个档次...第二步,执行以下命令创建文档目录并初始化。 docsify init ....04、定制化配置项 打开 index.html 文件, script 标签对 window.$docsify 进行配置,如下所示: window...., } 1)name:文档标题,会显示侧边栏顶部。...保存后,就可以浏览器上查看到效果。 ? 05、安装插件 1)全文搜索 全文搜索插件会根据当前页面上的超链接获取文档内容, localStorage 内建立文档索引。

1.1K10

实战 | docsify+云开发,高效创造你的文档网站

神器来了,docsify 是一个动态生成文档网站的工具。有了docsify,我们只要把时间投入到文档内容的编写,而无需关心格式,docsify能自动帮我们生成简洁优雅的文档网站,还有多种主题哦。...docsify的文档使用Markdown语法编写,如果你还不会编写Markdown,请先花十分钟学习Markdown语法教程。...本地初始化一个docsify文档网站 首先,我们先安装 docsify-cli 工具,可以方便创建及本地预览文档网站。...命令行上传 手动上传显得比较麻烦,我们也可以借助 cloudbase cli 命令行的方式执行上传。...弹出的页面确认授权: ? 进入到云环境查看页面,复制刚刚创建的云环境id: ?

1.2K40

如何快速搭建好看的个人博客(完整配置与源码)

, 对vue熟悉的朋友可以编写vue组件实现你想要的功能样式 vuepress特性 为技术文档而优化的内置Markdown拓展 Markdown文件中使用Vue组件的能力 Vue驱动的自定义主题系统...docs目录下创建README.md文件, 再运行,就可以看到运行起来的效果, 如下图所示: blog001.jpg 设置封面页 此时README文件没有内容,封面页是空的, 我们可以通过在这个markdown...导航栏创建好了, 接下来就是配置页面内容的侧边栏slider 配置侧边栏slider 1.自动获取侧边栏内容 如果你希望自动生成当前页面标题的侧边栏, 可以config.js配置来启用 // .vuepress...script> export default { name: 'fixed' } .... // 这里省略了部分样式代码, 想看全部的小伙伴点开github地址就可以了 然后配置文件插件的形式配置即可...目录 使用的是默认的构建输出位置 vuepress本地依赖的形式被安装到你的项目中, 根目录package.json文件包含如下代码: // 配置npm scripts "scripts": {

1.5K10

何在云开发静态托管中部署Docsify

云开发静态网站托管支持通过云开发SDK调用服务端资源:云函数、云存储、云数据库等,从而将静态网站扩展为全栈网站 docsifydocsify动态生成文档网站。...相反,它聪明地加载和分析您的Markdown文件,并将它们显示为一个网站。要开始使用它,只需创建一个index.html和在静态网站托管页面上部署它....创建项目 初始化这个项目 docsify init docs 初始化完成后,您可以修改/docs/README.md文件内容,然后本地运行 [fE1T6wWNYIo5Hue.png] 运行本地服务器...[s323at24zr.png] 登入 tcb login 这个时候会提醒你需要在网页授权,弹出的页面确认授权 [5u9479pj7j.png] 确认授权后,你会看到控制台输出相应的命令 执行命令上传文件...云开发控制台 查看,docsify的基本使用可以到其官网查看 如果在操作过程遇到问题,可以评论留下你的问题

1.5K40

2022-09-25 docsify 站点发布

docsify 终于算是弄完了,简单记录下。然后发现一个问题,相比 Hexo,Hugo 这些页面加载很慢,鱼与熊掌不可兼得,运行时生成只能这样了。 还有 navbar 的设置有时封面无法显示。...index.html 的 repo 是配置 Github 地址,会在网页右上角显示 Github 图标折角。...首页自定义显示卡片索引链接到具体文集,幸好之前学过前端,虽然不记得,笔记还在,不会用太复杂的,简单的还能写。 封面配置里不要用标题标签,不然点击会自动跳转,直接用 html 的 font 去设置。...formatUpdated: '{YY}-{MM}-{DD} {HH}:{mm}',记录的是文章最后的修改时间,然后文档里面插入{ docsify-updated }(需要把大括号左右两边空格去掉,这里为了显示加上...Mermaid插件支持写的方法可以正常显示,和官方的代码对比,发现官方的配置只要用使用下面的就能正常显示markdown: { renderer: { code: function

1.2K20

如何将 Docsify 项目部署到 CentOS 系统的 Nginx

❤️ 现代开发,文档的重要性不言而喻。而 Docsify 是一个轻量级的文档生成工具,使得创建漂亮的文档网站变得非常简单。...如果没有,你可以云服务提供商(阿里云、腾讯云)上创建一个 CentOS 服务器实例。.../docs 这将在项目目录下创建一个名为 docs 的文件夹,并包含 Docsify 的默认文件结构。你可以将你的文档内容放置 docs 文件夹。...第四步:本地预览 Docsify 项目 项目根目录运行以下命令: docsify serve docs 这将启动一个本地服务器,并在终端显示访问链接,通常是 http://localhost:3000...打开浏览器访问这个链接,你将看到 Docsify 文档站点。 第五步:配置 Nginx 服务器 部署到生产环境之前,我们需要配置 Nginx 以便正确地服务 Docsify 项目。

19110

开始自己的 markdown 写作

因为一些网站或软件,图片无法加载时会显示这个「图片名称」,这时至少还能给读者传递出一点有用信息。 学过 html 的同学更容易理解,可类比图片标签的 alt 属性。...尽量使用代码块时给出语言标识,有些 Markdown 工具会针对该语言高亮显示其中的语言元素。如果确实不属于任何语言或文件类型,建议标注为 text 。...JavaScript 文件 json 表示 json 文件 ini 表示 ini 配置文件 java 表示 java 代码 py 表示 python 代码 代码块的写法补充说明 您可以添加可选的语言标识符,围栏代码块启用语法突显...您可以语言 YAML 文件找出哪些关键词有效。 格式规范 缩进 文章每个段落的开头不要缩进。 列表嵌套列表时,内层列表使用 2 个空格进行缩进,而非 tab 键。...markdown 补充技巧 段落 通过文本行之间留一个空白行,可创建新段落。 隐藏内容 您可以通过 HTML 评论中加入内容来指示 GitHub 隐藏渲染的 Markdown 的内容。 <!

37250

为什么人家的开源项目文档如此炫酷?原来用的是这款神器!

对比我们的Docsify动态生成网站,对SEO更加友好。 使用VuePress具有如下优点: 使用Markdown来写文章,程序员写起来顺手,配置网站非常简洁。...我们可以Markdown中使用Vue组件,如果你熟悉Vue的话会非常方便。 打包网站时会为每个页面预渲染生成静态的HTML,性能好,也有利于SEO。...简洁高效: Markdown 为中心的项目结构,内置自动化工具,更少的配置完成更多的事。 沉浸式阅读:专为阅读设计的UI,配合多种颜色模式、可关闭的侧边栏和导航栏,带给你一种沉浸式阅读体验。...,点击导航栏即可跳转到该目录; 其实你还可以首页index.md通过添加feature来实现快速访问,这里我们创建了三个feature; --- home: true # heroImage: /...link: /springcloud-learning/ # 可选 imgUrl: /img/web.png # 可选 --- 首页显示效果如下; 每次我们创建文章的Markdown文件时,

1.1K20
领券