8000 `html` in `.ts/.tsx` is not formatted · Issue #5623 · prettier/prettier · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

html in .ts/.tsx is not formatted #5623

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.

Sign up for GitHub

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

Jump to bottom
Closed
JounQin opened this issue Dec 11, 2018 · 3 comments
Closed

html in .ts/.tsx is not formatted #5623

JounQin opened this issue Dec 11, 2018 · 3 comments
Labels
area:comments Issues with how Prettier prints comments area:multiparser Issues with printing one language inside another, like CSS-in-JS lang:typescript Issues affecting TypeScript-specific constructs (not general JS issues) locked-due-to-inactivity Please open a new issue and fill out the template instead of commenting. status:has pr Issues with an accompanying pull request. These issues will probably be fixed soon!
Milestone
1.16

Comments

@JounQin
Copy link
Member
JounQin commented Dec 11, 2018 •
edited by lydell
Loading

Prettier 1.15.3
Playground link

--parser typescript

Input:

const html = /* HTML */ `<!DOCTYPE html>
<HTML CLASS="no-js mY-ClAsS">
  <HEAD>
    <META CHARSET="utf-8">
    <TITLE>My tITlE</TITLE>
    <META NAME="description" content="My CoNtEnT">
  </HEAD>
  <body>
    <P>Hello world!<BR> This is HTML5 Boilerplate.</P>
    <SCRIPT>
      window.ga = function () { ga.q.push(arguments) }; ga.q = []; ga.l = +new Date;
      ga('create', 'UA-XXXXX-Y', 'auto'); ga('send', 'pageview')
    </script>
    <SCRIPT src="https://www.google-analytics.com/analytics.js" ASYNC DEFER></script>
  </body>
</HTML>`

Output:

const html = /* HTML */ `<!DOCTYPE html>
<HTML CLASS="no-js mY-ClAsS">
  <HEAD>
    <META CHARSET="utf-8">
    <TITLE>My tITlE</TITLE>
    <META NAME="description" content="My CoNtEnT">
  </HEAD>
  <body>
    <P>Hello world!<BR> This is HTML5 Boilerplate.</P>
    <SCRIPT>
      window.ga = function () { ga.q.push(arguments) }; ga.q = []; ga.l = +new Date;
      ga('create', 'UA-XXXXX-Y', 'auto'); ga('send', 'pageview')
    </script>
    <SCRIPT src="https://www.google-analytics.com/analytics.js" ASYNC DEFER></script>
  </body>
</HTML>`;

Expected behavior:
format html correctly like JavaScript
@lydell lydell added type:bug Issues identifying ugly output, or a defect in the program lang:typescript Issues affecting TypeScript-specific constructs (not general JS issues) area:multiparser Issues with printing one language inside another, like CSS-in-JS labels Dec 11, 2018
@ikatyang
Copy link
Member

The issue here is that the /* HTML */ comment is somehow not attached to the template literal.

@ikatyang ikatyang added the area:comments Issues with how Prettier prints comments label Dec 12, 2018
@Coder-256
Copy link

This seems to be related to #5588, relevant code:

prettier/src/language-js/embed.js

Line 555 in 6a45924

hasLanguageComment(node, "HTML") ||

@duailibe
Copy link
Member

Also happens with Flow, i.e. only works with babylon.

@ikatyang ikatyang mentioned this issue Dec 18, 2018
Merged
2 tasks
@ikatyang ikatyang added the status:has pr Issues with an accompanying pull request. These issues will probably be fixed soon! label Dec 18, 2018
@ikatyang ikatyang added this to the 1.16 milestone Jan 9, 2019
@lock lock bot added the locked-due-to-inactivity Please open a new issue and fill out the template instead of commenting. label Apr 9, 2019
@lock lock bot locked as resolved and limited conversation to collaborators Apr 9, 2019
@fisker fisker removed the type:bug Issues identifying ugly output, or a defect in the program label Mar 3, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
area:comments Issues with how Prettier prints comments area:multiparser Issues with printing one language inside another, like CSS-in-JS lang:typescript Issues affecting TypeScript-specific constructs (not general JS issues) locked-due-to-inactivity Please open a new issue and fill out the template instead of commenting. status:has pr Issues with an accompanying pull request. These issues will probably be fixed soon!
Projects
None yet
Milestone
1.16
Development

No branches or pull requests
6 participants
@fisker @duailibe @lydell @JounQin @ikatyang @Coder-256
0