[#33] Enable Prettier for Twig & Tailwind formatting #58
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Base automatically changed from
jp/51-header-and-footer
to
jp/45-page-blocks-and-sections
December 18, 2024 13:52
Base automatically changed from
jp/45-page-blocks-and-sections
to
jp/44-base-ui-elements
December 18, 2024 13:53
joshuapease
force-pushed
the
5.x
branch
2 times, most recently
from
ed9b9f8 to
6f1bd23
Compare
TODO: Still needc to sort out how to get TW to work with .twig extension
joshuapease
force-pushed
the
jp/33-twig-tailwind-prettier
branch
from
d081320 to
2bd9ddb
Compare
joshuapease
changed the title
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
An experimental branch to test Prettier for Twig & Tailwind.
Checkout the branch and run
ddev npm run formatto see it in action.The official TW prettier plugin supports
@zackad/prettier-plugin-twig(even though it doesn't say so in the readme)Twig Formatting
It's very "prettier" in its opinion. It introduces a lot of extra line breaks to keep line lengths short.
It doesn't look like our typical way of writing Twig, but it's not necessarily a bad thing.
Class Sorting
Below are a few common ways we write Tailwind CSS in our Twig templates.
Prettier catches most things that are within a normal
classattribute. However, it misses when we use attr withclass: 'bg-red-50.There might be some config options that could improve things a bit.
Prettier Errors
Default values in Macros seems to error (even though this is Basic Twig Stuff).