markdoc/markdoc

markdoc/markdoc

README


A powerful, flexible, Markdown-based authoring framework.


Markdoc is a Markdown -based syntax and toolchain for creating custom documentation sites and experiences.We designed Markdoc to power Stripe's public docs, our largest and most complex content site.

Installation


To get started with Markdoc, first install the library:

  1. ``` shell
  2. npm install @markdoc/markdoc
  3. ```

or

  1. ``` shell
  2. yarn add @markdoc/markdoc
  3. ```

and import it in your app:

  1. ``` js
  2. const Markdoc = require('@markdoc/markdoc');
  3. ```

or if you are using ESM

  1. ``` js
  2. import Markdoc from '@markdoc/markdoc';
  3. ```

then use Markdoc in your app or tool:

  1. ``` js
  2. const doc = `
  3. # Markdoc README

  5. {% image src="/logo.svg" /%}
  6. `;

  8. const ast = Markdoc.parse(doc);
  9. const content = Markdoc.transform(ast);
  10. return Markdoc.renderers.react(content, React);
  11. ```

Check out our docs for more guidance on how to use Markdoc.

TypeScript


This is the minimal tsconfig.json required to use Markdoc in your TypeScript project:

  1. ``` json
  2. {
  3.   "compilerOptions": {
  4.     "moduleResolution": "node",
  5.     "target": "esnext", // works with es2015 or greater
  6.     "esModuleInterop": true
  7.   }
  8. }
  9. ```

React


If you are using React, install Markdoc with:

  1. ``` shell
  2. npm install @markdoc/markdoc react @types/react
  3. ```

Contributing


Contributions and feedback are welcome and encouraged. Check out our contributing guidelines on how to do so.

Development


Run npm install
Run npm run build
Run the tests using npm test

Code of conduct


This project has adopted the Stripe Code of conduct.

License


This project uses the MIT license.

Credits


Special shout out to:

@marcioAlmada for providing us with the @markdoc GitHub org.
@koomen for gifting us https://markdoc.dev.