Gatsby: Variablen in Markdown?

Sie können einen kleinen benutzerdefinierten Helfer dafür schreiben (oder etwas wie lodash.template https://lodash.com/docs/4.17.11#template verwenden)

Hier ist eine schnelle und schmutzige Lösung:

Bei einer Markdown-Datei sample.md mit folgendem Inhalt:

---
title: Sample
---

## Hello World

This is a [link](%URL%/sub-path), and so is [this](%URL%/sub-path)

Sie können eine Datei erstellen (nennen wir sie src/utils/template.js ) und so etwas schreiben

export default function template(content, data) {
  return content.replace(/%(.+)%/g, (match, key) => {
    const value = data[key]
    if (typeof value !== 'undefined') {
      return value
    }
    return match // guards against some unintentional prefix
  });
}

Wenn Sie nun alles miteinander verbinden, müssen Sie nur noch diese Vorlagenfunktion verwenden, um Ihren Inhalt zu ersetzen. Das data -Objekt kann beliebig sein und von überall abgerufen werden (z. B. graphql, Datei mit einigen Konstanten, Umgebungsvariablen usw.).

import React from 'react'

import template from '../utils/template';

const URL = 'https://google.com'; // this can be from wherever

export default function SomeMarkdownPage({ data }) {
  // data is from GraphQL, presume the parent is data.markdown
  return (
    <div dangerouslySetInnerHTML={{
      __html: template(data.markdown.html, {
        URL
      })
    }} />
  )
}

Macht das Sinn? Dies könnte auch ein ziemlich nützliches Gatsby-Remark-Plugin sein, aber ich bin mir nicht sicher, ob es das gibt! Wenn Sie daran interessiert sind, das zu schreiben, wäre das cool, aber im Moment wird dies sicherlich für Ihren Anwendungsfall funktionieren!

Schließen Sie dies wie beantwortet, aber öffnen Sie es erneut, wenn einer von uns weiterhelfen kann. Danke, dass du Gatsby benutzt!