The theme.css file inside assets in extensions folder is not applying

[Prashant-202]

Issue summary

• @shopify/shopify-app-express version:
• Node version: 20.0.0
• Operating system: Ubuntu

Expected behavior

The rules inside the external CSS will be loaded and applied to the elements.

Actual behavior

The CSS file is loaded and showing inside the network but the rules are not applied to it.

Steps to reproduce the problem

1. Write some CSS code in the theme.css file inside the frontend/entrypoints folder.
2. Give classname to the element in which we want to apply the css rules.
3. Running the "npm run deploy" command and deploying the app

[wrightmk]

bump

[iskurbanov]

Yes, there must have been a small change in the build process that doesn’t acknowledge the tailwind styles when referenced separately.

You need to use the cssInjectedByJsPlugin to make it work. Npm install the package and then add it like this:

[wrightmk]

This works! thanks!

[921kiyo]

Thank you! This fixed the issue for me as well!

[bakikucukcakiroglu]

Thank you! That solved my problem as well. However you need to indicate it somewhere because I spent more then 5 hours to fix it.

[har1zarD]

I have a problem with Tailwind. When I add 10 different app blocks, Tailwind does not apply to any of them. But if I add one more app block that is identical to one of those 10, Tailwind immediately applies to all app blocks. So I need to add 2 identical app blocks to get Tailwind classes. @iskurbanov