Tailwind 配置未导出所有 CSS

Question

I am trying to publish the full tailwind 3.0 css library in a fresh laravel 8.* project with the view to use the corePlugins section to remove what I do not need. The thing is although the setup was quick, I can not get the complete tailwind css styles published in the public app.css file; only the base styles get published. So what am I doing wrong?

I started with npm to install :
install -D tailwindcss postcss autoprefixer .

2] Then, I setup mix :

.postCss('resources/css/app.css', 'public/css', [
        require("tailwindcss"),
        require("autoprefixer"),
    ]);

3] Then, I setup layers in the ./resource/css/app.css file:

@import "~tailwindcss/base";
@import "~tailwindcss/components";
@import "~tailwindcss/utilities";

4] Then, I added the full tailwind config in tailwind.config.js as stated on the box : npx tailwindcss init --full
Finally , I ran the command npm run dev to publish all styles in the public app.css file. But only the base styles was present in the public app.css file.

I am looking for a quick way to sample styles and remove the unnecessary bits. Can someone please assist?

Answer 1

There is no concept of a "full tailwind 3.0 css library" like in previous versions, as combining all the variations available in version 3 would be too large. This is explained here, https://tailwindcss.com/blog/tailwindcss-v3#just-in-time-all-the-time

So it is compulsory to configure the purge settings, which is now called content in tailwind.config.js .

So by default, if Tailwind does not find any styles to add to the output, then all it will output is the base files, which is what it sounds like it is currently doing for you.