Prettier hat die geschweiften Klammern „{ }' in der .jsx-Datei entfernt

Question

Ich habe den folgenden Codeblock in meiner .jsx-Datei:

<div className="">
        <h1 className="">
          The Next <br className="sm:block hidden" /> {" "}
          <span className="text-gradient">Generation </span> {" "}
          Payment
        </h1>
      </div>

Aber Prettier entfernt das zweite {" "} so:

<div className="">
        <h1 className="">
          The Next <br className="sm:block hidden" /> {" "}
          <span className="text-gradient">Generation </span>
          Payment
        </h1>
      </div>

Es wird auch {" "} in anderen Teilen des Codes entfernen. Wenn mir jemand bei der Lösung dieses Problems helfen kann, wäre ich sehr dankbar.

Die einzige Lösung, die ich gefunden habe, war in prettier的配置中使用prettier.bracketSpacing, aber es hat nicht geholfen.

Answer 1

尝试这个：

const space = " ";
return ( ...
<div className="">
   <h1 className="">
       下一代<br className="sm:block hidden" /> {space}
       <span className="text-gradient">支付</span> {space}
       付款
   </h1>
</div>