feat: format js and css with prettier if prettier is on the $PATH#1230
feat: format js and css with prettier if prettier is on the $PATH#1230
Conversation
There was a problem hiding this comment.
Pull Request Overview
This PR implements automatic formatting of JavaScript and CSS code within templ files using Prettier when it's available on the system PATH. The feature addresses issue #481 by integrating Prettier formatting for script elements and CSS during the templ formatting process.
Key changes:
- Added a new
internal/prettierpackage to interface with the Prettier CLI tool - Created a new
internal/formatpackage that handles templ file formatting with script element processing - Refactored the format command to use the new formatting infrastructure
Reviewed Changes
Copilot reviewed 17 out of 82 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
internal/prettier/prettier.go |
New package providing interface to Prettier CLI for formatting JS/CSS |
internal/prettier/prettier_test.go |
Tests for the Prettier integration functionality |
internal/format/templ.go |
New main formatting logic for templ files with script element processing |
internal/format/scriptelement.go |
Specialized formatting for script elements using Prettier |
parser/v2/types.go |
Added WriteStart and WriteEnd methods to ScriptElement for flexible output |
cmd/templ/fmtcmd/main.go |
Refactored to use new formatting package instead of inline logic |
flake.nix |
Added Prettier as a development dependency |
go.mod |
Moved natefinch/atomic from direct to indirect dependency |
internal/format/scriptelement.go
Outdated
| return nil | ||
| } | ||
|
|
||
| func showWhitespace(s string) string { |
There was a problem hiding this comment.
The showWhitespace function appears to be a debug utility that should be removed or moved to test code since it's only used by the debug print statement.
|
@joerdav - this is currently a bit rough around the edges, but it works. I think this might be a good way to get CSS and JS formatting into templ. |
|
Can take a look this week! Just back off from a week of house move shenanigans |
|
Cool yeah this looks good so far! |
|
Added CSS formatting, and refactored all the tests to use prettier instead of htmldiff - might as well reduce dependencies. |
|
Looks good! Hopefully this replaces my little hack: https://github.com/therealparmesh/prettier-plugin-templ-script Will this be compatible with Tailwind’s prettier plugin for sorting classes? |
|
@therealparmesh - not at the moment, because it's only formatting the contents of |
|
Thanks for reviewing that beast of a PR! |
Closes #481