feat: custom prettier plugin to correctly format inline MDX components#29770
Merged
mvvmm merged 5 commits intoproductionfrom Apr 13, 2026
Merged
feat: custom prettier plugin to correctly format inline MDX components#29770mvvmm merged 5 commits intoproductionfrom
mvvmm merged 5 commits intoproductionfrom
Conversation
github-actions
bot
added
product:workers
github-actions
bot
assigned
patriciasantaana,
elithrar,
joshthoward,
lambrospetrou,
mikenomitch,
Oxyjun,
vy-ton,
pedrosousa,
GregBrimble and
irvinebroque
Contributor
|
This pull request requires reviews from CODEOWNERS as it changes files that match the following patterns:
|
mvvmm
changed the title
Contributor
Contributor
Author
|
Checked each of the files output myself, and they all look correct. |
mvvmm
requested review from
a team,
GregBrimble,
celso,
elithrar,
irvinebroque,
jonesphillip,
mia303 and
patriciasantaana
as code owners
mvvmm
requested review from
a team,
MattieTK,
Oxyjun,
WalshyDev,
joshthoward,
korinne,
lambrospetrou,
mikenomitch,
pedrosousa and
vy-ton
as code owners
mvvmm
changed the title
ctdsf
pushed a commit
to ctdsf/cloudflare-docs
that referenced
this pull request
Apr 13, 2026
* Remove global-level for aws-alb doc: partially addresses cloudflareGH-29770 * AI-assisted: split zone-level to account for global and vet API links * AI-assisted: add <Tabs> pattern and Dash instructions * Move note on encryption mode higher and use callout * Manual: tighten up information in index and clarify cert priority * Manual: tighten up information in index and clarify cert priority * Fix e.g. and replace operation links with actual endpoint names * Update other how-tos affected with page re-org * AI-assisted: check against cloudflareGH-29400 and bring improvements * Improve text in index.mdx and update zone-level steps * More deatils on the per-hostname steps * AI-assited: inspect related docs and improve aws-alb-integration * Update per-hostname with no toggle and API in manage-certs * Apply suggestions from code review Co-authored-by: Jun Lee <junlee@cloudflare.com> --------- Co-authored-by: Jun Lee <junlee@cloudflare.com>
MohamedH1998
approved these changes
Apr 13, 2026
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
13 participants
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.
Summary
Adds a custom prettier plugin (
prettier-plugin-mdx-inline) that prevents prettier from wrapping<code>and<GlossaryTooltip>children onto new lines in MDX files.The problem: Prettier's MDX formatter treats standalone JSX elements as block-level and wraps their children onto new lines when they exceed
printWidth. MDX v2+ interprets those newlines as markdown paragraph boundaries, injecting<p>tags inside inline elements — producing broken HTML like<code><p>...</p></code>. This is a known MDX behavior (mdx-js/mdx#1798) and prettier's MDX parser does not yet account for it (prettier/prettier#12209 tracks MDX v3 support which may eventually resolve this). The codebase relied on 41prettier-ignorecomments to work around it.The fix: The plugin wraps prettier's built-in MDX parser and converts matching JSX AST nodes to opaque HTML nodes that prettier outputs verbatim. It also collapses any existing multi-line formatting (from previous prettier runs) back to a single line. The element list is configurable via
mdxInlineElementsin.prettierrc.mjs.What changed in content files:
prettier-ignorecomments that were guarding<code>and<GlossaryTooltip>elements<code>blocks back to single lines (these had been reformatted by prettier in the past withoutprettier-ignoreprotection)Performance: Negligible overhead (~60ms across 231 files, within run-to-run noise).
Images
Here are just two examples...
Before
https://developers.cloudflare.com/durable-objects/best-practices/websockets/
https://developers.cloudflare.com/durable-objects/api/base/
After
https://mdx-formatting.preview.developers.cloudflare.com/durable-objects/best-practices/websockets/
https://mdx-formatting.preview.developers.cloudflare.com/durable-objects/api/base/