Skip to content

Prettier formatting breaks JSDoc comments #454

Closed as not planned
Closed as not planned
@karlhorky

Description

@karlhorky

Initial checklist

Affected packages and versions

[email protected], @mdx-js/[email protected], [email protected], react@^18

Link to runnable example

No response

Steps to reproduce

  1. Ensure Prettier is installed
  2. Copy the example from the Props section in the readme to an MDX file
  3. Format the file with Prettier
  4. Observe backslashes added before asterisk characters and the error message below
    Could not parse expression with acorn MDX micromark-extension-mdx-expression:acorn
    
  5. Replace the multi-line JSDoc comment with a single-line JSDoc block
  6. Format the file with Prettier
  7. Observe space being added before second asterisk character and error message below
    Property 'name' does not exist on type '{ readonly components?: {} | undefined; }'. ts-plugin(2339)
    

Prettier Input/Output:

Input:

{/**
  * @typedef Props
  * @property {string} name
  *   Who to greet.
  */}

{/** @typedef Props @property {string} name2 Who to greet. */}

# Hello {props.name} and {props.name2}

Output:

{/\*\*

- @typedef Props
- @property {string} name
- Who to greet.
  \*/}

{/* * @typedef Props @property {string} name2 Who to greet. */}

# Hello {props.name} and {props.name2}
Kapture.2024-07-07.at.22.17.37.mp4

Companion issue in prettier/prettier

I've also reported this as an issue in prettier/prettier:

If it's desired to only track it in prettier/prettier, then this issue can be closed.

Expected behavior

No problems with Prettier formatting using MDX comments with JSDoc

Actual behavior

Problems with Prettier formatting using MDX comments with JSDoc

Runtime

Node v20

Package manager

No response

OS

macOS

Build and bundle tools

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    👀 no/externalThis makes more sense somewhere else👎 phase/noPost cannot or will not be acted on

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions