為什麼 eleventy-plugin-remark 能保留樣板引擎前處理

Eleventy 預設是由 markdown-it 處理 Markdown 內容的，在 markdown-it 處理前，會先使用 Liquid 或你設定的樣板引擎進行前處理，至於其他使用 eleventyConfig.addExtension("md", ...) 替換的 Markdown 函式庫則不會做前處理。不過 @fec/eleventy-plugin-remark 這個 Eleventy plugin 除了可以用 Remark 處理 Markdown 內容外，也一樣會用樣板引擎進行前處理，它到底是怎麽做的？

Eleventy 還有一個設定可以指定 Markdown 函式庫：eleventyConfig.setLibrary("md", myMarkdownLibrary )，用它指定函式庫不會跳過前處理，但這個設定不是所有 Markdown 函式庫都能被指定。根據文件上的記載，這個設定比較像是自訂 markdown-it 用的，例如我們可以用它修改一些設定：

import markdownIt from "markdown-it";

export default function (eleventyConfig) {
  let options = {
    html: true,
    breaks: true,
    linkify: true
  };

  eleventyConfig.setLibrary("md", markdownIt(options));
}

這代表這個設定指定的值必須要符合 markdown-it 的行為。實際上 Eleventy 原始碼有用到的 property 就三個：set()、disable() 跟 render()，前兩個如果沒指定函數也會被跳過，所以只要我們做一個 Remark 的 wrapper，上面有實作 render()，讓 Eleventy 可以傳入 Markdown 字串及 Data Cascade 並得到 render 後的 HTML，就可以裝作 markdown-it 可以用 eleventyConfig.setLibrary() 設定進去，從而適用樣板引擎的前處理。

這就是 @fec/eleventy-plugin-remark 為什麼可以讓 Remark 完美替換掉 Eleventy 預設的 Markdown 函式庫的原因。

理論上如果 Markdown 函式庫有 data store 可以存放 Eleventy 的 Data Cascade，應該就可以讓 Eleventy 使用，只要 Eleventy 的程式碼沒變的話。

參考資料