ampproject / ampproject/amphtml
I2I: prettier for HTML
- Dominant language
- JavaScript
- Stars
- 14.9k
- Forks
- 4.1k
- PR merge metrics
- No merged PRs in 30d
Description
## Motivation
`prettier` is used for automatically formatting most code in this repo, except for HTML files.
When applying `prettier` directly, the AMP boilerplate [will explode into many lines](https://prettier.io/playground/#N4Igxg9gdgLgprEAuEALGBbANgAwDpQA8qcAhgCYB8BABDYQM4wCeWcNpGADgLQBGEAJZsATlyyl4lAeWbAeAdzh8A1oJg9SUQRkmDoSTdx5NSImDQAcDGkzhcGACgCMAGgTkAlDQAMN5zRQECK6WDQCMKgA3DwYEABemtq6MPpQhpy8puZWNnYOLu5QXr7+gcGh4RCRMRgMSTp6BkZZMGYW1rbwBW4e3n40AUEhpGER0VqNqc2ZJm05nflOvcX9ZcOV4wC+AAKKymoaKnDMAGYinHA2LXPtwOcQGMAAboIMgnzC6sxIqILk5AQWxgEBebw+XxYSFe7z4bC2u1iCR4xzOFwwVxoN2yMHuIkeYNhkJ+fwBQJBhIhWG+0PBcLgCL2dRRJ3Ol2usxxeIJMKpNNJgKgwNBvM+1KhovhiIgLLR7KxnPmuIeT1FxN+-0FwspYppkoZu1RbIxHOMXJVOvVAvJIrp6v1CMIAHomKw4JRCEEGGARIIuDAPa62BxjAJhHAxBIpDI5PtVOoGik0kgglA4LVkZMkwZU+nYvUs010rmooXpsXoAznUH3c6vT6-QGCM6SBRqFAcFEQK4QBB-WkGMhQGZ8QoAApmBCDlCkZ5CcjdkB8C5gY4wADKXFIYEEUAA5sgYCIAK5wHvobAAdT+8AYW7AcHXU-UgleLGQ4AYg57u4YEZgY4XHuujIKcox-j2ABWDAAB4AEIrmu66XAAMrucCgeBZ4gNBMHrrue5sAAise1QYUgYFYBBIBbiIf4iB+fCkHwcBYIuXC+rAl7-JEyCWD4PYcRAf6XhcXAfhxVwRs8GE9gAjqR8CAX204gKQ9RpnAgILj2IhwApgh6YBpDAaQmFUdhf4YIIh4npZBHEYp5GUdRbR8Nx5C8UgABMPZHqQXz7gAwo8IEoLmi7Hn+AAqzHTi52HPKeACSxQIBuDb+gAgsU64sGw5l-giQA), even though it's usually written as one. This creates noise.
This issue describes a strategy for auto-formatting HTML files in this repository, while keeping the boilerplate written as one line.
## State of ``
`` will only ignore the first node on the next line. This is problematic for AMP documents that hold a second `` node in their boilerplate, which [will not be ignored](https://prettier.io/playground/#N4Igxg9gdgLgprEAuEALGBbANgAwDpQA8qcAhgCYB8BABDYQIQC0TNADgE5wwwCWcHJrwDmUCFxotqUOoQDOMAJ5Y4NUhjZMARhF4qObLKXiUd5RcCYB3OFoDWvGE1JReGY72hJnGpgtIcMDQAHHI0CnBscgAUAIwANAjkAJQ0AAxhsTRiHO5YNDowqADcTBgQAF7Oru58Xj6a-oEhYRFRcYlQKemZ2eJ5BRBFpRhy1W4e9eqNMAFBoeHw7QlJqRk0WTkDhSUuE3VQ3tN+s80LbTErXWu9W6T5OwC+AALWtg5OdnCKAGYc6nAwg0TnNgH8IBhgAA3XhyXhaPSORRIVC8cjkBCPGAQaGw+GIpRIGFwrQqR4vMqVJhfX7-DCAyTHJowMEcCG4kkE5Go9GY7Ec-FYJFEvGkuDk16janfP4AoFM04s8GQ4mC4U8jFQLE41UIoWE3VkikQaW0uWM3zM1ns3VclFozXagV64WG8UvGmy+nyy2K60q0V2jV8nWB-XIt3kwgAegUyjglEIYjkYA4vDYMETcZUal8Oj0AkMxgTZgsb3sjnGtU8hzEUDgIype2rXjrDbKY2bk1r0AbXYOSDbjxj2YTMeTqfTmYIMZIFGkOGKIHiIAgGZrcmQoACbKsAAUAghNyhSFDdORlyAtP8wF8YABlNikMC8KDCZAwDgAVzgK-Q2AAdVReA5CfMA4HvI9HF4GElGQcA5E3FdXzkAQYD3f5hHcZAfnuVCVwAKzkAAPAAhG873vAEABlXzgHC8N-EAiOI+9X2EFQAEUvyGeikFwrB8JAJ8OFQjh4K0UgtDgLBL04V8YAAtEimQYI0hXTgIFQgD-jYeDOEBAQoXolcAEcePgDC12PEBSDGes4AxC8Vy4czeC4DDSCw0gGMEpjUIwXgP2-fz2K4iy+IEoTZi0JTyBUpAACYV0-UhETfABhCFsJQNtLy-VCABUpOPKKmKhH8AEkugQB9JwzABBLp7yUFRfNQ8kgA). This applies for every AMP format except ads.
A feature request for `prettier` introduces [ignore range blocks for HTML](https://github.com/prettier/prettier/issues/5508). This would allow us to include any type of AMP boilerplate in one ignore section:
```html
/* ... *//* ... */
```
## Opportunities
Including the boilerplate in a `prettier-ignore` block would allow the [Playground](https://playground.amp.dev) to use `prettier` (/cc @ampproject/wg-outreach)
/cc @ampproject/wg-infra
Contributor guide
Assessment
This issue has not been assessed yet.