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

feat: support MDX #4975

Merged
merged 2 commits into from Aug 13, 2018

Conversation

Projects
None yet
7 participants
@ikatyang
Member

ikatyang commented Aug 11, 2018

Fixes #4960

  • format block html (jsx)
  • format import/export
  • does not support <!-- comment --> in jsx
  • inline htmls are printed as-is

Prettier pr-4975
Playground link

--parser mdx

Input:

import   Graph   from    './components/graph'

## Here's a graph

<Graph
values={[1,
  2, 3
  , 4]}
/>

Output:

import Graph from "./components/graph";

## Here's a graph

<Graph values={[1, 2, 3, 4]} />

  • I’ve added tests to confirm my change works.
  • (If changing the API or CLI) I’ve documented the changes I’ve made (in the docs/ directory)
  • I’ve read the contributing guidelines.

@ikatyang ikatyang referenced this pull request Aug 11, 2018

Closed

MDX Support #4960

opts &&
(opts.parser === "json" ||
opts.parser === "json5" ||
opts.parser === "__js_expression")

This comment has been minimized.

@j-f1

j-f1 Aug 11, 2018

Member

Would it make sense to flip this conditional around and list the parsers that use the parse method?

const index = value.indexOf(EMPTY_NEWLINE);
const subvalue = value.slice(0, index);
if (isExport(subvalue) || isImport(subvalue)) {

This comment has been minimized.

@j-f1

j-f1 Aug 11, 2018

Member

Could this be simplified to /^(?:im|ex)port/.test(subvalue)?

This comment has been minimized.

@ikatyang

ikatyang Aug 11, 2018

Member

It's from mdx-js/mdx, IMO we shouldn't touch them if possible so that we could keep sync easily.

@@ -368,6 +375,11 @@ function genericPrint(path, options, print) {
: concat(["\\", hardline]);
case "liquidNode":
return replaceNewlinesWith(node.value, hardline);
// MDX
case "importExport":
case "jsx":

This comment has been minimized.

@j-f1

j-f1 Aug 11, 2018

Member

Also, how do you feel about replacing these with jsStatement and jsExpression, respectively?

This comment has been minimized.

@ikatyang

ikatyang Aug 11, 2018

Member

These are the names from the original source (I replaced import/export with importExport and merged continuous importExport nodes so that the empty lines can be handled by the js printer), and I think these names should be easier to understand.

@azz

This comment has been minimized.

Member

azz commented Aug 12, 2018

You're on fire, @ikatyang! 🔥🔥🚒

@azz

azz approved these changes Aug 12, 2018

@ikatyang ikatyang merged commit 1790211 into prettier:master Aug 13, 2018

9 of 10 checks passed

codecov/project 96.48% (-0.01%) compared to 82a12a5
Details
ci/circleci: build_prod Your tests passed on CircleCI!
Details
ci/circleci: checkout_code Your tests passed on CircleCI!
Details
ci/circleci: test_prod_node4 Your tests passed on CircleCI!
Details
ci/circleci: test_prod_node9 Your tests passed on CircleCI!
Details
ci/circleci: test_prod_standalone Your tests passed on CircleCI!
Details
codecov/patch 95% of diff hit (target 80%)
Details
continuous-integration/appveyor/pr AppVeyor build succeeded
Details
continuous-integration/travis-ci/pr The Travis CI build passed
Details
deploy/netlify Deploy preview ready!
Details

@ikatyang ikatyang deleted the ikatyang:feat/mdx branch Aug 13, 2018

@kentcdodds

This comment has been minimized.

Member

kentcdodds commented Aug 13, 2018

This is wonderful! 👏👏👏 Thank you!

@trevordmiller

This comment has been minimized.

trevordmiller commented Aug 25, 2018

Thank you! Excited for this to be released. Thank you for prettier and all the wonderful work - it saves so much time and mental energy :)

@kachkaev kachkaev referenced this pull request Sep 6, 2018

Merged

Use mdx #300

14 of 14 tasks complete
@tadeuszwojcik

This comment has been minimized.

tadeuszwojcik commented Sep 19, 2018

@ikatyang great work, thanks! Is there a change it will get released soonish? :) I have plenty of badly formatted mdx files just waiting to try it out :)

@ikatyang

This comment has been minimized.

Member

ikatyang commented Sep 19, 2018

I'd like to get #5098 done and then release 1.15, but you could install the dev version from GitHub for now:

npm install prettier/prettier
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment