首页 > 解决方案 > Standalone prettier, html formatter isn't properly formatting JS

问题描述

I'm formatting code directly on the browser using the Prettier Standalone version.

Here is my code:

import parserHtml from "prettier/parser-html";
import prettier from "prettier/standalone"

const rawHtml = `<script SameSite="None; Secure" src="https://unpkg.com/typebot-js"></script>
<div id="typebot-container" style="width: 100%; height: 600px;"></div>
<script>
  Typebot.initContainer("typebot-container", {publishId: "remember-on-second-visit-iblkqj1-pw",hiddenVariables: {test: "null",}});
</script>`

const snippet = prettier.format(
    rawHtml,
    { parser: "html", plugins: [parserHtml] }
  );

It will output:

<script SameSite="None; Secure" src="https://unpkg.com/typebot-js"></script>
<div id="typebot-container" style="width: 100%; height: 600px;"></div>
<script>
  Typebot.initContainer("typebot-container", {publishId: "remember-on-second-visit-iblkqj1-pw",hiddenVariables: {test: "null",}});
</script>

Whereas if I'm pasting the HTML code on my IDE, Prettier will correctly format the JS code:

<script SameSite="None; Secure" src="https://unpkg.com/typebot-js"></script>
<div id="typebot-container" style="width: 100%; height: 600px"></div>
<script>
  Typebot.initContainer("typebot-container", {
    publishId: "remember-on-second-visit-iblkqj1-pw",
    hiddenVariables: { test: "null" },
  });
</script>

What am I missing?

标签: prettier

解决方案


推荐阅读