Mathjax support

kurtharriger · Feb 21, 2016 · 8efa11c · 8efa11c
1 parent f1e1001
commit 8efa11c
Show file tree

Hide file tree

Showing 6 changed files with 63 additions and 1 deletion.
diff --git a/gatsby.config.js b/gatsby.config.js
@@ -0,0 +1,9 @@
+
+module.exports = function(config, env) {
+  config = config.merge(function(cfg) {
+    cfg.resolveLoader.modulesDirectories.unshift(`${__dirname}/loaders`);
+    //cfg.resolve.modulesDirectories.push('/usr/local/lib/node_modules/gatsby/node_modules');
+    return cfg;
+  });
+  return config;
+}
diff --git a/html.jsx b/html.jsx
@@ -22,8 +22,13 @@ module.exports = React.createClass({
           <title>{title}</title>
           <link rel="shortcut icon" href={this.props.favicon}/>
           <TypographyStyle/>
+
+          <script type="text/javascript" async
+            src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_CHTML">
+          </script>
         </head>
         <body>
+
           <div id="react-mount" dangerouslySetInnerHTML={{ __html: this.props.body }} />
           <script src="/bundle.js"/>
         </body>

diff --git a/loaders/markdown-loader/index.js b/loaders/markdown-loader/index.js
@@ -0,0 +1,39 @@
+import frontMatter from 'front-matter'
+import markdownIt from 'markdown-it'
+import hljs from 'highlight.js'
+import _ from 'underscore'
+
+const highlight = (str, lang) => {
+  if ((lang !== null) && hljs.getLanguage(lang)) {
+    try {
+      return hljs.highlight(lang, str).value
+    } catch (_error) {
+      console.error(_error)
+    }
+  }
+  try {
+    return hljs.highlightAuto(str).value
+  } catch (_error) {
+    console.error(_error)
+  }
+  return ''
+}
+
+const md = markdownIt({
+  html: true,
+  linkify: true,
+  typographer: true,
+  highlight,
+}).use(require('markdown-it-mathjax'));
+
+module.exports = function (content) {
+  let body
+  this.cacheable()
+  const meta = frontMatter(content)
+  body = md.render(meta.body)
+  const result = _.extend({}, meta.attributes, {
+    body,
+  })
+  this.value = result
+  return `module.exports = ${JSON.stringify(result)}`
+}
diff --git a/package.json b/package.json
@@ -13,11 +13,16 @@
   "author": "Kyle Mathews <mathews.kyle@gmail.com>",
   "license": "MIT",
   "dependencies": {
+    "front-matter": "^2.0.6",
+    "highlight.js": "^9.1.0",
+    "markdown-it": "^6.0.0",
+    "markdown-it-mathjax": "^1.0.2",
     "react": "^0.14.3",
     "react-document-title": "^2.0.1",
     "react-dom": "^0.14.3",
     "react-responsive-grid": "^0.3.0",
     "react-router": "^0.13.5",
-    "typography": "^0.6.2"
+    "typography": "^0.6.2",
+    "underscore": "^1.8.3"
   }
 }
diff --git a/pages/_template.jsx b/pages/_template.jsx
@@ -9,6 +9,7 @@ module.exports = React.createClass({
 
   render: function() {
     return (
+
       <div>
         <Container
           style={{

diff --git a/pages/index.md b/pages/index.md
@@ -2,3 +2,6 @@
 title: Hi people
 ---
 Welcome to your new Gatsby site.
+
+Must have $\pi$
+