写在前面

Md2site 是基于 Omi 的一款 Markdown 转网站工具,使用简单,生成的文件轻巧,功能强大。

在使用之前的版本的时候,你会发现体验非常好?为什么非常好?因为页面间的切换是无刷新!
无刷新的原理就是,所有的 markdown 都会被 webpack 打包到 js 里,只要在 js 动态 require 就行。

这样带来的一个问题便是:如果有海量的 markdown 的时候,首次加载的时间非常长。

怎么解决?支持动态拉取和解析 markdown~~

使用姿势

所有命令都是和以前一样的。接下来,打开 project.js:

  • 你把 async 改成 true 就代表会生成一个异步拉取和解析 markdown 的网站
  • 你把 async 改成 false 就代表会生成一个完全无刷新的网站

够方便吧!!一键配置!!

原理解析

防止 webpack 打包 markdown

当我们设置 async 为 true 的时候,不是希望 webpack 把 markdown 打包入 js 里的,所以在 webpack config 做了如下操作:

其中 config.module.loaders[3] 就是配置的 markdown loader。exclude 就代表把相关的正则匹配到的文件直接给无视掉。

动态加载 markdown

加载完后直接交给 remarkable 解析成 HTML,remarkable 解析成 HTML 的速度超快到你无法感知,所以提前生成好 HTML 不是非常必要。

Async Update

异步的刷新组件。

详细的代码可以看这里

Github

欢迎使用~~

原创文章转载请注明:

转载自AlloyTeam:http://www.alloyteam.com/2017/03/omi-md2site-0-5-0-released-supports-dynamic-markdown-pull-parsing/

  1. emptyx 2017 年 9 月 22 日

    github 打不开了。。

  2. tom 2017 年 3 月 15 日

    👍

发表评论