refactor(rebuild): remove unused deps and create proper remark plugin

Author: skipjack

package.json

@@ -88,6 +88,7 @@
     "remark-autolink-headings": "^5.0.0",
     "remark-loader": "^0.3.0",
     "remark-mermaid": "^0.2.0",
+    "remark-slug": "^5.0.0",
     "request-promise": "^4.2.2",
     "sass-loader": "^6.0.6",
     "sitemap-static": "^0.4.2",
@@ -97,6 +98,7 @@
     "tap-parser": "^6.0.1",
     "through2": "^2.0.3",
     "uglifyjs-webpack-plugin": "^1.1.6",
+    "unist-util-visit": "^1.3.0",
     "url-loader": "^0.5.9",
     "webpack": "^3.10.0",
     "webpack-dev-server": "^2.9.7",
@@ -118,11 +120,7 @@
     "react-hot-loader": "^4.0.0-beta.12",
     "react-router": "^4.2.0",
     "react-router-dom": "^4.2.2",
-    "remark-parse": "^5.0.0",
-    "remark-slug": "^5.0.0",
     "tool-list": "^0.11.0",
-    "unified": "^6.1.6",
-    "unist-util-visit": "^1.3.0",
     "webpack.vote": "^0.1.2",
     "whatwg-fetch": "^2.0.3"
   }

src/utilities/remark-anchors.js

@@ -0,0 +1,27 @@
+const visit = require('unist-util-visit');
+
+/**
+ * A remark plugin to extract anchors markdown headers
+ *
+ * @param  {object}   options - ...
+ * @return {function}         - ...
+ */
+module.exports = function extractAnchors(options = {}) {
+  let { anchors, levels } = options
+
+  if ( !Array.isArray(anchors) ) {
+    throw new Error('Missing or malformed `anchors` in options.')
+  }
+
+  return function transformer(ast) {
+    visit(ast, 'heading', visitor);
+  };
+
+  function visitor(node) {
+    // TODO: Default header `levels` and check it to filter the `push`ed anchors
+    options.anchors.push({
+      title: node.children[0].value,
+      id: node.data.id
+    });
+  }
+}

src/utilities/remark-extract-anchors.js

@@ -1,6 +1,10 @@
 const fs = require('fs');
 const FrontMatter = require('front-matter');
-const RemarkAnchors = require('./remark-anchors');
+const remark = require('remark');
+const slug = require('remark-slug');
+
+// TODO: Extract these to separate packages
+const ExtractAnchors = require('./remark-extract-anchors');
 
 module.exports = function(item, options) {
   item.url = item.path
@@ -10,16 +14,27 @@ module.exports = function(item, options) {
     .replace(/^$/, '/');
 
   if (item.type === 'file') {
+    let anchors = [];
+    let content = fs.readFileSync(item.path, 'utf8');
+    let { attributes } = FrontMatter(content);
+
     // remove underscore from fetched files
     if (item.name[0] === '_') {
       item.name = item.name.replace('_', '');
       item.url = item.url.replace('_', '');
     }
 
-    let content = fs.readFileSync(item.path, 'utf8');
-    let { attributes } = FrontMatter(content);
+    remark()
+      .use(slug)
+      .use(ExtractAnchors, { anchors })
+      .process(content, (err, file) => {
+        if (err) {
+          throw err;
+        }
+      });
+
+    item.anchors = anchors;
 
     Object.assign(item, attributes);
-    item.anchors = RemarkAnchors(content);
   }
 }