@astrojs/markdoc #6209
Merged
@astrojs/markdoc #6209
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
🦋 Changeset detectedLatest commit: 79673ea The changes in this PR will be included in the next version bump. Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
github-actions
bot
added
pkg: astro
bholmesdev
force-pushed
the
markdoc-poc
branch
4 times, most recently
from
772f6ee
to
e7894ed
Compare
bholmesdev
commented
Feb 14, 2023
matthewp
requested changes
Feb 14, 2023
|
!preview markdoc |
|
|
!preview markdoc |
|
|
!preview markdoc |
|
bholmesdev
force-pushed
the
markdoc-poc
branch
from
3626704
to
bd0dd9d
Compare
|
What config options are going to exist for the markdoc integration? |
|
This has been moved to stage 2: withastro/roadmap#496 |
bholmesdev
commented
Feb 27, 2023
Comment on lines
+23
to
+27
| <Fragment set:html={`<${Node.tag} ${stringifyAttributes(Node.attributes)}>`} /> | ||
| {Node.children.map((child) => ( | ||
| <Astro.self node={child} /> | ||
| ))} | ||
| <Fragment set:html={`</${Node.tag}>`} /> |
There was a problem hiding this comment.
Attempted to clean this up attribute stringifier by calling our JSX runtime instead. i.e. const Component = jsx(Node.tag, Node.attributes). However, calling the JSX runtime creates an infinite render loop in development, whether called within the astroNode.ts file or the .astro frontmatter 😕 Note sure if @natemoo-re has better context on this.
There was a problem hiding this comment.
Maybe it's good to avoid reusing the JSX runtime for now as according to some recent benchmarks we found that JSX rendering is a bit slow. #6415
There was a problem hiding this comment.
Another option would be creating this component with our internal JS API, but this seems fine too.
bholmesdev
force-pushed
the
markdoc-poc
branch
from
bd0dd9d
to
9c9f6e2
Compare
|
Benchmark findings here! This tests Markdoc against Markdown and MDX across multiple test suites. TL;DR: Markdoc is blazingly fast 🔥 |
|
!preview markdoc |
|
sarah11918
reviewed
Mar 1, 2023
There was a problem hiding this comment.
I'm so looking forward to playing around with this, Ben! 🥳
Here are some initial thoughts and questions on a first read through. Nothing too major, and with this being experimental, we can absolutely iterate on these docs as people start using the integration and asking questions. But I think a little bit upfront could be helpful.
I think think after addressing these comments (some are clarifying questions), I think Team Docs is ready to just take this and run with it? How do you feel about that? I don't think there's much technical here that we'd have trouble with, nor more than the occasional clarifying question we might have as we otherwise mostly go deep into checking for consistency with other integration docs, and other nits. We'd be happy to absolve you of any further responsibility if you're OK with that!
natemoo-re
reviewed
Mar 7, 2023
Comment on lines
+23
to
+27
| <Fragment set:html={`<${Node.tag} ${stringifyAttributes(Node.attributes)}>`} /> | ||
| {Node.children.map((child) => ( | ||
| <Astro.self node={child} /> | ||
| ))} | ||
| <Fragment set:html={`</${Node.tag}>`} /> |
There was a problem hiding this comment.
Another option would be creating this component with our internal JS API, but this seems fine too.
| const ast = Markdoc.parse(body); | ||
| const content = Markdoc.transform(ast, markdocConfig); | ||
|
|
||
| return `import { jsx as h } from 'astro/jsx-runtime';\nimport { Renderer } from '@astrojs/markdoc/components';\nconst transformedContent = ${JSON.stringify( |
There was a problem hiding this comment.
Are we using the jsx-runtime here for any reason other than it having a convenient signature? I would expect this to use our JS API for components.
| super(...params); | ||
|
|
||
| const { | ||
| code = 99999, |
There was a problem hiding this comment.
What is the expectation with these error codes? Would be good to leave a comment.
There was a problem hiding this comment.
Honestly no clue 😅 We don't have a system for error codes for integrations outside of Astro core. Just used 99999 as a stand-in. I'll leave a comment for now so we can discuss best practices on discord.
commit fbab73c Author: matthewp <matthewp@users.noreply.github.com> Date: Tue Mar 7 16:38:11 2023 +0000 [ci] format commit a206106 Author: Matthew Phillips <matthew@skypack.dev> Date: Tue Mar 7 11:35:54 2023 -0500 Expose the ssr manifest (#6435) * Expose the ssr manifest * Add changeset * Add types for virtual mod commit 2751584 Author: Princesseuh <Princesseuh@users.noreply.github.com> Date: Tue Mar 7 15:14:15 2023 +0000 [ci] format commit 694918a Author: Erika <3019731+Princesseuh@users.noreply.github.com> Date: Tue Mar 7 16:12:21 2023 +0100 Implement RFC "A core story for images" (#6344) * feat(assets): Add Vite plugin * feat(images): Set up Image component * fix(types): Attempt to fix type generation * Revert "fix(types): Attempt to fix type generation" This reverts commit 063aa27. * fix(image): Fix image types causing build to fail * feat(image): Implement client side part * feat(services): Allow arbitrary transforms parameters * fix(image): Fix paths and types * config(types): Update config types to provide completions for available services * feat(image): Add serving in dev * feat(image): Improve type error messages * refactor(image): Move sharp's parseParams to baseService * refactor(image): Skip work in dev for remote servies * feat(image): Add support for remote images * feat(image): Add squoosh service * chore: update export map * refactor(image): Abstract attributes handling by services * config(vercel): Remove test image service * feat(image): Support for relative images in Markdown (WIP) * feat(images): Add support for relative images in Markdown * feat(image): Update with RFC feedback * fix(image): Fix alt error on getImage * feat(image): Add support for assets validation through content collections * feat(image): Remove validateTransform * feat(image): Move to assets folder * fix(image): Fix package exports * feat(image): Add static imports references to virtual moduel * fix(image): Fix images from content collections not working when embedded * chore: lockfile * fix(markdown): Fix type * fix(images): Flag enhanced images behing an experimental flag * config(example): Update images example conifg * fix(image): Fix types * fix(image): Fix asset type for strict, allow arbritary input and output formats * chore: fix example check * feat(image): Emit assets for ESM imported images * Add initial core image tests (#6381) * feat(images): Make frontmatter extraction more generic than images for future * feat(image): Add support for building * fix(image): Fix types * fix(images): Fix compatibility with image integration * feat(images): Cuter generation stats * fix(images): Globals are unsafe, it turns out * fix(images): Only generate images if flag is enabled * fix(images): Only create `addStaticImage` in build * feat(images): Add SSR endpoint * fix(images): Only inject route in SSR * Add tests for SSR * Remove console.log * Updated lockfile * rename to satisfy the link gods * skip build tests for now * fix(images): Fix WASM files not being copied in dev * feat(images): Add quality presets * fix build tests running * Remove console.log * Add tests for getImage * Test local services * Test the content collections API * Add tests for quality * Skipping content collections test * feat(image): Add support for `~/assets` alias * test(image): Add tests for aliases in dev * Fix windows + content collections * test(image): Add tests for aliased images and images in Markdown * Fix markdown images being built * Should be posix join * Use the optimized image * fix test * Fixes windows smoke * fix(image): Nits * feat(images): Add automatic update for `env.d.ts` when experimental images are enabled * fix(images): Revert env.d.ts change if the user opted-out of the experimental image support * chore: remove bad image example project * feat(image): Rename `experimental.images` to `experimental.assets` * fix(images): Remove unused code in MDX integration * chore: Remove unrelated change * fix(images): Remove export from astro/components * Fix, esm import on Win * test(images): Add test for format * fix(images): Add `client-image.d.ts` to export map * chore: changeset * fix(images): Adjust with feedback, no more automatic refine, asset() -> image() * fix(images): Fix types * fix(images): Remove unnecessary spread * fix(images): Better types for parseUrl and transform * fix(images): Fix types * fix(images): Adjust from feedback * fix(images): Pass width and height through getHTMLAttributes even if they're not added by the uesr * fix(images): Recusirsively extract frontmatter assets * fix(images): Use a reduce instead * feat(images): Add support for data: URIs * chore: changeset * docs(images): Misc docs fixes * Update .changeset/gold-rocks-cry.md Co-authored-by: Chris Swithinbank <swithinbank@gmail.com> * Update .changeset/gold-rocks-cry.md Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca> * Update packages/astro/src/@types/astro.ts Co-authored-by: Chris Swithinbank <swithinbank@gmail.com> * Update packages/astro/src/assets/services/service.ts Co-authored-by: Chris Swithinbank <swithinbank@gmail.com> * Update packages/astro/src/assets/services/service.ts Co-authored-by: Chris Swithinbank <swithinbank@gmail.com> * Update packages/astro/src/assets/services/service.ts Co-authored-by: Chris Swithinbank <swithinbank@gmail.com> * Update packages/astro/src/assets/types.ts Co-authored-by: Chris Swithinbank <swithinbank@gmail.com> * Update packages/astro/src/assets/types.ts Co-authored-by: Chris Swithinbank <swithinbank@gmail.com> --------- Co-authored-by: Matthew Phillips <matthew@skypack.dev> Co-authored-by: Matthew Phillips <matthew@matthewphillips.info> Co-authored-by: Chris Swithinbank <swithinbank@gmail.com> Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca> commit 377530a Author: ematipico <ematipico@users.noreply.github.com> Date: Tue Mar 7 13:43:21 2023 +0000 [ci] format commit fe88f89 Author: Emanuele Stoppa <my.burning@gmail.com> Date: Tue Mar 7 13:41:24 2023 +0000 chore: use directive `@ts-expect-error` instead of `@ts-ignore` (#6429) commit e1858e6 Author: ematipico <ematipico@users.noreply.github.com> Date: Tue Mar 7 06:57:52 2023 +0000 [ci] format commit 75921b3 Author: Emanuele Stoppa <my.burning@gmail.com> Date: Tue Mar 7 06:55:41 2023 +0000 feat(cli): add `--watch` to `astro check` command (#6356) * feat(cli): add `--watch` to `astro check` command * chore: refactor in a leaner way, logic not changed * chore: lint * chore: revert changes in sync command * chore: tweak server settings * test: add one test case * chore: increase timeout * test: predictable testing * chore: add changeset * chore: code suggestions * code suggestions * chore: use directly `chokidar` * chore: tweak code * fix: open documents first * chore: disable test * chore: code suggestions * chore: code suggestions * Apply suggestions from code review Co-authored-by: Erika <3019731+Princesseuh@users.noreply.github.com> * code suggestions * chore: rebase --------- Co-authored-by: Erika <3019731+Princesseuh@users.noreply.github.com> commit 1291afc Author: Bjorn Lu <bjornlu.dev@gmail.com> Date: Tue Mar 7 14:50:34 2023 +0800 Fix changeset run (#6442) commit 00a0af7 Author: Bjorn Lu <bjornlu.dev@gmail.com> Date: Tue Mar 7 10:52:47 2023 +0800 Move benchmark package and update changeset config (#6433) commit af05a4f Author: Nate Moore <natemoo-re@users.noreply.github.com> Date: Mon Mar 6 14:06:33 2023 -0600 Update README.md (#6437) * Update README.md * Update README.md commit 8ebf4b7 Author: Nate Moore <natemoo-re@users.noreply.github.com> Date: Mon Mar 6 14:03:33 2023 -0600 chore: update branding assets (#6436) commit afbbc4d Author: Erika <3019731+Princesseuh@users.noreply.github.com> Date: Mon Mar 6 19:57:16 2023 +0100 Update compilation target for Node 16 (#6213) * config(esbuild): Update esbuild target to node16 * config(package): Update root package.json node engine * config(tsconfig): Update all the tsconfigs module and targets * chore: changeset * chore: remove unneeded file commit 18acae3 Author: Sarah Rainsberger <sarah@rainsberger.ca> Date: Mon Mar 6 14:36:40 2023 -0400 [error docs] update link for client-side scripts (#6423) commit 8b49d17 Author: ematipico <ematipico@users.noreply.github.com> Date: Mon Mar 6 17:03:18 2023 +0000 [ci] format commit a4a74ab Author: Emanuele Stoppa <my.burning@gmail.com> Date: Mon Mar 6 16:58:56 2023 +0000 feat(cli): add help flags to various commands (#6394) Co-authored-by: Happydev <81974850+MoustaphaDev@users.noreply.github.com> commit b087b83 Author: Dennis Morello <dennismorello@gmail.com> Date: Mon Mar 6 17:38:42 2023 +0100 Add getStaticPaths type helpers to infer params and props (#6150) * feat(astro): add InferGetStaticParamsType and InferGetStaticPropsType type helpers * chore(astro): added changeset commit 19fe4cb Author: Houston (Bot) <108291165+astrobot-houston@users.noreply.github.com> Date: Mon Mar 6 08:30:38 2023 -0800 [ci] release (#6414) Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
github-actions
bot
added
pkg: create-astro
This reverts commit fbe129b.
github-actions
bot
removed
pkg: preact
sarah11918
approved these changes
Mar 7, 2023
This reverts commit 3e99783.
Merged
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Markdoc.demo.v2.mp4
Changes
@astrojs/markdocintegration.mdocor.mdfilesContentcomponent to render based on Markdocconfigandcomponentspropertiesastro:config:setupintegration hook:addContentEntryTyperender()type signature in favor of generated types per-extension. This allows type checking forContentprops that are specific to MarkdocTesting
Add Markdoc + content collections tests for dev and build
Add
performance/package with content collection test benchmarkASTRO_PERFORMANCE_BENCHMARKflag to disable nonessential remark plugins for Markdown and MDX (GFM, Smartypants, Shiki, heading IDs). This ensures a level playing field comparing against Markdoc.build.mjsscript to generate 1000 files of each file type and compare build timesDocs
@astrojs/markdocREADME