MarkdocViewer: reading markdown documentation from open git repository (just in one page) !
MarkdocViewer:从公开的git仓库阅读markdown文档 (就一个页面)!
- 阅读器相关配置存储到
sessionStorage里,以支持多浏览器标签阅读不同文档 MarkdocViewer现已支持暗黑模式!点击页面右上角的 🌙/☀️ 按钮即可切换,自动检测系统偏好设置,用户偏好会被保存,下次访问时自动应用- 修正
Markdown文档渲染之后的图片链接地址,避免 404 不可见
marked.js升级至16.3.0版本highlight.js依赖升级至11.11.1版本,并引入marked-highlight插件github-markdown-css由本地 CSS 文件升级至5.8.1CDN 版本- 提升用户体验,增加内容加载指示器,优雅的错误处理和提示
- 重构核心
MarkdownViewer组件
- 解决无法渲染
markdown表格问题
- 增强网页资源安全,加上外部资源
integrity属性值
MarkdocViewer 默认配置如下:
// default options
{
// git repo raw file base_url, default to github
'base_url': 'https://raw.githubusercontent.com/',
// document directory, default empty
'base_dir': '',
// git repo name, default 'yascmf/docs'
'repo_name': 'ycrao/mynotes',
// git branch name, default 'master'
'branch_name': 'master',
// index file name, using it to generate sider -nav menu
'index_file': 'index.md',
// home file name, default 'README.md'
'home_file': 'intro.md',
// element id for left-sider or right-sider menu in HTML
'sider_id': 'sider-menu',
// element id for main content in HTML
'content_id': 'content',
}以上某些配置,可以通过传入查询串,予以重载新配置:
https://raoyc.com/markdoc-viewer?doc=intro.md&dir=&index=index.md&repo=ycrao/mynotes&home=intro.md&branch=master
其中,dir 查询串对应 base_dir 、repo 对应 repo_name 配置,后面依次类推。请保证,查询串值与仓库文档实际结构目录一致。
const dir = config("dir", ""),
repo = config("repo", "ycrao/mynotes"),
branch = config("branch", "master"),
index = config("index", "index.md"),
home = config("home", "intro.md");
const options = {
base_url: "https://raw.githubusercontent.com/",
base_dir: dir,
repo_name: repo,
branch_name: branch,
index_file: index,
home_file: home,
sider_id: "sider-menu",
content_id: "content",
};
console.log(config);
var mv = new MarkdocViewer(options);
mv.viewer();- 我的笔记:原始仓库为 ycrao/my-notes ,在线阅读🔗
- 《生死之外,皆是美好》:原始仓库为 XiaomingX/about_death ,在线阅读🔗
- 【译】《笨办法学C》:原始仓库为 wizardforcel/lcthw-zh ,在线阅读🔗
- 《ECMAScript 6入门》:原始仓库为 ruanyf/es6tutorial ,在线阅读🔗
本源码使用到以下开源组件:
markedgithub-markdown-csshighlight.jsbootstrap- 感谢 GitHub 提供项目文档托管服务。