-
-
Notifications
You must be signed in to change notification settings - Fork 4.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
MDX 3 #12209
Comments
Remark and MDX ecosystems use Pure ECMAScript Modules Packages. We need to use that parser, and I think the our ECMAScript Modules migration(#10157) block this work. |
For now, As a first step, I will restart the migration to remark-parser v9 (#11938) |
As you’re already bundling prettier when releasing, could you bundle mdx-js/mdx / remark-parse and such as CJS? |
Do you mean bundling ESM Packages( /cc @fisker |
I’m suggesting something like an npm script that works like this: npx esbuild @mdx-js/mdx --bundle --platform=node --outfile=vendor/mdx.js That could be run once in a while. Like, every month? It doesn’t have to affect running Prettier in development? |
Thank you! I think we can use the way you suggested. It may solve the problem that we cannot use other Pure ESM packages I'll try it. |
Just to add, when the parsing does work, the inline markdown within components in MDX2 is mangled - see the Playground example here Input <div>
## foo
a paragraph
another paragraph
</div> Output <div>## foo a paragraph another paragraph</div> Expected output <div>
## foo
a paragraph
another paragraph
</div> Not sure whether the parser update will fix this. |
Thank you people for working on this.
Prettier automatically changes it to:
Which breaks MDX parsers -- this is no longer a valid Javascript/JSX expression and it won't be executed. Using Prettier's recommended Thank you. |
we unpin this issue temporary because we should pin #12931 |
Hey @cpboyd I can't recreate the issue you're having. For me, running Prettier on That said, I have found inconsistencies with ignoring in MDX. What works most reliably for me is to use start and end in combination with blank lines, like this: {/* prettier-ignore-start */}
When writing <Abbr a="HTML" />, keeping the document valid is a good first step
towards accessibility. Compared to XHTML, HTML5 validation is surprisingly
lenient, requiring only a <HtmlTag t="DOCTYPE" /> and a <HtmlTag t="title" />
element. The document below is valid even though it doesn’t contain an
<HtmlTag t="html" />, <HtmlTag t="head" /> or <HtmlTag t="body" /> element,
because they’re all considered optional. Also optional is the closing
<HtmlTag t="/p" /> tag.
{/* prettier-ignore-end */} Without those ignores, Prettier will incorrectly insert new lines before the lines that start with the inline |
@michrome You're right with that specific example since it's under the 80 character threshold. I'd left out attributes when I replied. See this playground instead <Custom test="really-long-string-test-hello-world-get-to-80-characters">Hello World</Custom> That said, now I'm unable to reproduce in VSCode after restart. |
{/* prettier-ignore-start */}
<Custom test="really-long-string-test-hello-world-get-to-80-characters">Hello World</Custom>
{/* prettier-ignore-end */} Doesn't wrap in the playground 👍 |
Maybe I'd had a space after the ignore block previously, because that apparently breaks the ignore. Edit: Seems to happen with a single space after both |
MDX v3 has been released. We're too legacy now. |
### What Commit essential linting and formatting config from our favourite IDE to the repository. The aim is to have the same config across the team and across IDE so we avoid dealing with changes that shouldn't be part of our PR. * Add config for Intellij and vscode - Remove gitignore on .idea config - Disable prettier on MDX files - Use LF as default line separator - Enable format on save * Run `prettier --write "**/*.{**/*,*}.{js,ts,jsx,tsx,scss,css,html,json}"` * Remove prettier-ignore in mdx files About MDX: Disable formatting totally, as the maximum printWidth rule conflicts with MDX syntax about new line = `<p>`. Latest issue that we had: #2128 . Issue on Prettier repository: prettier/prettier#12209 If this wouldn't be enough, the second option is to ensure that our files are checked before committed with a git hook: https://github.com/lint-staged/lint-staged For review: you can do it commit by commit. --------- Co-authored-by: Philipp Gfeller <[email protected]>
We have to note that new MDX parsers will not treat **この部分は強調とみなされなくなりました。**ご注意ください。 |
@tats-u I think your time is better spent working on a solution rather than spamming all projects that do something with markdown. If you don’t know how to solve it, you could try and motivate other Chinese or Japanese speakers involved. |
@wooorm I would not like to post an extra comment, but sou should not have used the verb "spam" before evaluating my suggestion on that issue even though I should have posted it on issues or PRs that directly mention on upgrading remark-parse instead. You must have noted that this change will have to be added in the change log in the version that updates the remark parser and MDX before posting the comment. |
(looks like I mistakenly somehow posted the same comment twice) |
I forgot to say that some test cases related to CJK languages might have to be modified when upgrading remark to newer versions to support MDX v3 (PRs trying to do are stagnant). |
I won't fix such cases at least, they would be known issues if I'm developing, it is out scope of prettier itself. |
…fixed (prettier#15221) State that the supported version of MDX is 1
MDX #15221 |
…ge (#177) This PR fixes #174 with a new `VersionedDocsLink` component that reads the docusaurus config to determine what the latest stable version is. It also adjusts the other dynamic link to the contribution guide to use this. This link is changed from the latest RC versions (currently 2.20) to the current `main` version (2.21), i.e. the absolute most up-to-date version of the contribution guide, which seems most relevant to contributors since they'll be starting in the `main` branch. This has a few issues with the component due to prettier/prettier#12209, which forces us into a very long line on the `_index.mdx` page. I'm unclear if a broken link will be detected or not.
MDX 2 was released on 1 Feb 2022: https://github.com/mdx-js/mdx/releases/tag/2.0.0
UPD: MDX 3 was released on 24 Oct 2023: https://github.com/mdx-js/mdx/releases/tag/3.0.0
The changes are summarised in the blog post: https://mdxjs.com/blog/v2/
UPD: https://mdxjs.com/migrating/v3/
Here is a big one for Prettier:
The example below is from the blog post. It is a valid MDX in v2, but Prettier 2.5.1 is unable to parse it:
Prettier 2.5.1
Playground link
Input:
Output:
Expected behavior:
No syntax error
Let’s track MDX
23 support here 👀The text was updated successfully, but these errors were encountered: