Back to Astro

Astro Example: Markdoc (experimental)

examples/with-markdoc/README.md

0.0.122.2 KB
Original Source

Astro Example: Markdoc (experimental)

This starter showcases the experimental Markdoc integration.

sh
npm create astro@latest -- --template with-markdoc

šŸ§‘ā€šŸš€ Seasoned astronaut? Delete this file. Have fun!

šŸš€ Project Structure

Inside of your Astro project, you'll see the following folders and files:

text
/
ā”œā”€ā”€ public/
ā”œā”€ā”€ src/
│   └── content/
        └── docs/
│           └── intro.mdoc
|       └── config.ts
│   └── components/Aside.astro
│   └── layouts/Layout.astro
│   └── pages/index.astro
|   └── env.d.ts
ā”œā”€ā”€ astro.config.mjs
ā”œā”€ā”€ markdoc.config.mjs
ā”œā”€ā”€ README.md
ā”œā”€ā”€ package.json
└── tsconfig.json

Markdoc (.mdoc) files can be used in content collections. See src/content/docs/ for an example file.

You can also render Astro components from your Markdoc files using tags. See the markdoc.config.mjs file for an example configuration.

šŸ§ž Commands

All commands are run from the root of the project, from a terminal:

CommandAction
npm installInstalls dependencies
npm run devStarts local dev server at localhost:4321
npm run buildBuild your production site to ./dist/
npm run previewPreview your build locally, before deploying
npm run astro ...Run CLI commands like astro add, astro check
npm run astro -- --helpGet help using the Astro CLI

šŸ‘€ Want to learn more?

Feel free to check our documentation or jump into our Discord server.