Kokk — 优美的单页文档生成工具

[yilin12]

DEMO

Github 地址

Kokk 可以把一个 markdown 文件渲染为一个单页的文档，⚠️注意这里的单页就是一页，不是单页面 2333

除了这个，你还可以引入 Vue 的组件，然后把它渲染到文档里的某个地方。比如这个例子就用了 kokk 和 vue-juri 来生成文档并展示 demo。

项目灵感来自于 Ant Design，我非常喜欢这个项目，第一次看代码时简直惊艳，项目结构、代码规范都做的非常之好，文档也很棒，生成文档用的是 bisheng，我一开始以为是必胜的意思，想着诶这个程序员也蛮中二的啊，后来看了 wiki 才发现指的是毕升 😂 我才不会说我本来想写一个 bisheng for Vue.js 但是失败了所以先写个这个试试

kokk 和 vue-juri 名字都来自刻刻，推荐一下最喜欢的一月新番，今天有更新啊写完这个要回家追番了！

[mokeyjay]

一个建议——行间距是不是大过头了？

[viko16]

“把一个 markdown 文件渲染为一个单页的文档”
额，相当于 marked + 漂亮 css ？

[yilin12]

@mokeyjay 样式参考的这个 https://up.docs.apex.sh/ ，其实这种风格蛮好看的，性冷淡风？

[trendzi]

想问一下：
Kokk 可以把一个 markdown 文件渲染为一个单页的文档。
你的 demo 例子中，没看到 markdown 文件在那里。

渲染，可以在后端做吗？

[yilin12]

@viko16 对 😂 但是还有生成侧边栏和插入自定义组件，比如你可以这样 https://user-images.githubusercontent.com/12069729/37286779-f027a5e0-263d-11e8-9712-c8005edee5e4.png
这个 demo 展示的部分就是一个 Vue 的组件，你可以 import 这个组件，然后插入到文档的某个地方，写这个的初衷就是想能同时渲染 markdown 和展示 demo，就像 ant.design 的文档那样。

[yilin12]

@trendzi 在文档的 quick start 部分有例子的哈，如果不需要插入自定义组件的话，就只需要一个 html 文件和一个 markdown 文件，这两个放在一个目录下，比如都放在 docs/ 目录，然后在 html 文件用 script 标签引入 kokk.js ，初始化 const doc = new Kokk() doc.start('#app') 就可以了。然后 serve docs/ 目录就能访问生成的文档，比如用
GitHub Pages 展示时，source 选择 docs/ 目录，然后就可以访问文档了

[yilin12]

@trendzi demo 里有例子的，https://github.com/luyilin/kokk/tree/master/docs demo 就是 serve 的 docs 目录里的
index.html 和 README.md 。然后 docs 目录里的 components docs dev 这三个目录的内容是引入自定义插件的例子 😅

[v2gg]

@yilin12 这是 ant.design 嘛？

[v2gg]

@yilin12 噗没看 demo 就来评论了 打我吧 2333

[yilin12]

@v2gg 23333 配合 https://github.com/luyilin/vue-juri 一起食用效果更佳

[Elven]

很棒棒呀，准备拿这个写文档～

[yilin12]

@Elven 嘻嘻 have fun !

[v2gg]

@yilin12 哇这个好棒！去试试 qvq