Tailwind: Purge CSS-in-JS config
What does this MR do and why?
This extends the tailwind_all_the_way.mjs to accept an --only-used flag. Basically tailwind_all_the_way is called in two scenarios:
- CI, when building the assets (via
yarn run pretailwindcss:build
): This now uses--only-used
. The css_in_js is reduced to only the classes which are found. This gives us a positive list of things to resolve. The resulting file can be found in the artifacts of thecompile-test-assets
job. - CI, when doing static analysis to figure out we could hypothetically (via
lint:tailwind-utils
): This still compiles the full set of utilities in order to compare it to the full list of utilities from gitlab-ui.
MR acceptance checklist
Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Screenshots or screen recordings
N/A
How to set up and validate locally
In rails console (or via toogle: http://127.0.0.1:3000/rails/features
)
Feature.enable(:tailwind_all_the_way)
- In your GDK, add:
export TAILWIND_ALL_THE_WAY=true
toenv.runit
- Restart webpack / vite:
gdk restart webpack
/gdk restart vite
- Visit any page. The page should look visually alright and a CSS file named
assets/tailwind_all_the_way-[hash].css
should be loaded
Edited by Lukas Eipert