tools icon indicating copy to clipboard operation
tools copied to clipboard

📎 Support prettier-style jsx quotes

Open nstepien opened this issue 1 year ago • 2 comments

Description

Since Rome 12.1.0, Rome started enforcing the same quote style on JSX prop strings. This breaks parity with prettier: with "singleQuote": true prettier would still format JSX strings with double-quotes.

Playground example

Straying away from prettier as the "standard" makes it a hard pill to swallow as projects would have to reformat the majority of their files.

Possible approaches:

  • revert back to always formatting JSX strings with double quotes
  • add a new option, something like "jsxQuoteStyle": "double" / "single", "double" by default. I think it's a fairly safe option to add as it wouldn't affect the formatting of other parts of the code, it'd only change the quote characters and quote escaping in the strings.

Previous discussion: https://github.com/rome/tools/issues/4469

nstepien avatar May 16 '23 10:05 nstepien

I agree, this started reformatting all our JSX, which was not optimal.

johnschult avatar May 16 '23 19:05 johnschult

As an alternative name: markupQuoteStyle. Which pairs well with XML (JSX is JavaScript XML), HTML & YAML

Vivalldi avatar May 17 '23 18:05 Vivalldi

what is the status of this? wanted to update to version 12, but this is blocking us

vascomontyero avatar May 31 '23 15:05 vascomontyero

I could take it to implement🤗

denbezrukov avatar May 31 '23 15:05 denbezrukov

  "javascript": {
    "formatter": {
      "quoteStyle": "single",
      "jsxQuoteStyle": "double"
    }
  }

This don't work as expected.

  • Expected behavior:
const App = () => {
  const stringVar = '123'; // quoteStyle single
  return <div id="xxx" />; // jsxQuoteStyle double
}
  • Current behavior:
const App = () => {
  const stringVar = "123"; // jsxQuoteStyle double, quoteStyle single would be useless here
  return <div id="xxx" />; // jsxQuoteStyle double
}

afc163 avatar Jul 11 '23 15:07 afc163

This feature hasn't been released yet, but it works as expected: https://docs.rome.tools/playground/?quoteStyle=single&code=YwBvAG4AcwB0ACAAQQBwAHAAIAA9ACAAKAApACAAPQA%2BACAAewAKACAAIABjAG8AbgBzAHQAIABzAHQAcgBpAG4AZwBWAGEAcgAgAD0AIAAnADEAMgAzACcAOwAgAC8ALwAgAHEAdQBvAHQAZQBTAHQAeQBsAGUAIABzAGkAbgBnAGwAZQAKACAAIAByAGUAdAB1AHIAbgAgADwAZABpAHYAIABpAGQAPQAiAHgAeAB4ACIAIAAvAD4AOwAgAC8ALwAgAGoAcwB4AFEAdQBvAHQAZQBTAHQAeQBsAGUAIABkAG8AdQBiAGwAZQAKAH0A

You would need to use a nightly release to avail of the feature.

ematipico avatar Jul 11 '23 15:07 ematipico