feat(docs): add prettier-plugin-bootstrap for automatic class sorting#42383
Open
pierluigilenoci wants to merge 1 commit intotwbs:mainfrom
Open
feat(docs): add prettier-plugin-bootstrap for automatic class sorting#42383pierluigilenoci wants to merge 1 commit intotwbs:mainfrom
pierluigilenoci wants to merge 1 commit intotwbs:mainfrom
Conversation
3 tasks
pierluigilenoci
force-pushed
the
feat/prettier-plugin-bootstrap
branch
from
7fe4e5a to
3158fd4
Compare
pierluigilenoci
force-pushed
the
feat/prettier-plugin-bootstrap
branch
from
7a4e7fe to
b61bbe7
Compare
Contributor
Author
|
cc @julien-deramond @mdo @coliff — this adds automatic Bootstrap class sorting to the docs site via a Prettier plugin (similar to prettier-plugin-tailwindcss). Happy to adjust anything if needed. |
pierluigilenoci
force-pushed
the
feat/prettier-plugin-bootstrap
branch
3 times, most recently
from
6edb2a7 to
7d7841b
Compare
Adds `prettier-plugin-bootstrap` (v0.3.0) to automatically sort Bootstrap CSS classes following the framework's architecture order. - Adds `prettier-plugin-bootstrap@^0.3.0` as a dev dependency - Configures `.prettierrc.json` with the plugin (after prettier-plugin-astro) - Reformats 28 `.astro` files with sorted class attributes (no functional changes) Plugin features: - Sorts classes: layout → components → helpers → utilities - Responsive variants sort after their base class - Supports HTML, JSX/TSX, Vue, Angular, Svelte, and Astro - Public sorting API via `prettier-plugin-bootstrap/sorter` - 121 tests, 100% coverage, zero runtime dependencies Signed-off-by: Pierluigi Lenoci <pierluigilenoci@gmail.com>
pierluigilenoci
force-pushed
the
feat/prettier-plugin-bootstrap
branch
from
7d7841b to
4cb6504
Compare
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
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.
Summary
Adds
prettier-plugin-bootstrapas a standalone npm package to automatically sort Bootstrap CSS classes following the framework's recommended order — similar to what prettier-plugin-tailwindcss provides for Tailwind CSS.This addresses the feedback from #42359 where @coliff and @julien-deramond suggested extracting the plugin into a separate package.
Closes #38397
What changed
package.json— addsprettier-plugin-bootstrap@^0.2.1as a dev dependencysite/.prettierrc.json— addsplugins: ["prettier-plugin-astro", "prettier-plugin-bootstrap"].astrofiles — class attributes reordered byprettier --write(no functional changes)Plugin features (v0.2.x)
d-md-flex) sort immediately after their base classbootstrapFunctionsoption for sorting insideclsx(),cn(),classNames()callsSorting order
bootstrap.scssimport order)scss/_utilities.scssPlugin repository
https://github.com/pierluigilenoci/prettier-plugin-bootstrap
Test plan
npx prettier --config site/.prettierrc.json -c sitepasses (after fix(docs): wrap adjacent JSX elements in fragments for Prettier compat #42389 is merged)