Tailwind v2 and Sage 9

sage
41

Going further with development I had some issues with PurgeCSS as managed by webpack, so I switched to the Tailwind-integrated one.

On the latest versions in my branch you can see I commented everything about PurgeCSS in resources/assets/build/webpack.config.optimize.js and switched on the purge section in resources/assets/styles/tailwind.config.js.

Did you follow this configuration?

42

Yes. I download last repo, use composer , yarn and yarn build. I dont change anything.

43

I came across the same issue after I finished building the whole site and realized that I never tested production.
The error seems to be that the purge arguments are set relative to the tailwind config, while it should be relative to the root folder. I am not sure if this is only a Windows/WSL problem, though.
So this fixed it in tailwind.config.js:

purge: [
      './app/**/*.php',
      './resources/views/**/*.php',
      './resources/assets/scripts/**/*.js',
    ],
1 Like
44

Thanks, file-loader@5.1.0 worked for me!

45

but also had problems with font appearances - 4.3.0 worked

46

Has anyone gotten this to work with JIT mode?

It works for me when I build, but not when I use BrowserSync

47

There are still some issues with the __webpack_hmr error in the console when running yarn start:
Failed to load resource: the server responded with a status of 404 (Not Found)

But for the most part @strarsis’s repo (GitHub - strarsis/sage9-webpack5-tailwind: Sage 9 with webpack and tailwind) and @pi43r’s purge fix instructions (Tailwind v2 and Sage 9 - #43 by pi43r) combined did the trick for bringing up an old Sage 9 project with Tailwind up to date.

Thank you to everyone for posting their solutions, much appreciated!

48

Is this the same issue?

Those issues are very hard to track down. I already have tried to get it fixed.

Now the loaders have also changed, some were abandoned, some replace them.
A new branch is opened now that tries to use the latest packages (state 2021 end/2022):