This is similar problem to this problem: #35706 except that I now use the latest method to load CSS libraries.
When I run this code:
$wa = $app->getDocument()->getWebAssetManager();
$wa->registerAndUseStyle('com_phocacart.main', 'com_phocacart/main.css');
in component, everything is OK - main.css is loaded first, template user.css after.
But when I do the same in module:
$wa = $app->getDocument()->getWebAssetManager();
$wa->registerAndUseStyle('com_phocacart.main', 'com_phocacart/main.css');
main.css is loaded after user.css (see image):
(if you ask why running component css in module, this is because modules of large component share one CSS and in case the module is displayed on page where its component is not displayed, it loads the CSS without running component)
EDIT:
When I create some CSS for module, it even does not work with module CSS (see image)
$wa = $app->getDocument()->getWebAssetManager();
$wa->registerAndUseStyle('mod_phocacart_filter.test', 'mod_phocacart_filter/test.css');
user.css should be loaded last
user.css is not loaded last, it is loaded before main.css (CSS from component)
Joomla 4.2
So the question is, is there some specific parameter which can solve this problem?
EDIT: Is there some specific parameter for modules to not load their CSS before template user.css?
Thank you, Jan
Labels |
Added:
No Code Attached Yet
|
Title |
|
Title |
|
Hi Christiane, does it mean, I can define dependency in way: "load before user.css"?
I can confirm this issue. I had the same problem yesterday with a template. I tried a lot, also joomla.asset.json, a plugin and so on, to get the user.css later then other assets. Didn't find a practical, intuitive way.
BTW in fact we need the opposite of dependency here. Because if we define dependency, we load it after some declared CSS but we need to load it before some declared CSS (in this case user.css)
$wa = $app->getDocument()->getWebAssetManager();
$wa->registerAndUseStyle('mod_phocacart_filter.test', 'mod_phocacart_filter/test.css', [], [], ['template.user']);
It's the exact opposite of what we need.
I saw this in template cassiopeia. It should be possible to swap the dependency if needed. But did not dive deeper into this and could be completely wrong
{
"name": "template.user",
"description": "A file where a user can add their own css.",
"type": "style",
"uri": "user.css",
"dependencies": [
"template.active",
"template.active.language"
]
},
Currently the order is FIFO + Dependency.
Because user.css loaded by template, and it always before we render modules and it cannot depend from module.css, the user.css goes first and then module.css.
That one of isses that left from j3 :)
OK, so this means, user.css is not loaded as last currently. Is there more information on this topic? Is there any limit to ensure loading user.css or custom.css last?
user.css is not loaded as last currently
I think, it never planned to be a last, but just to be after template.css.
In theory it is possible, there one undocumented feature,
I try tests, maybe will do pr for user.css.
Status | New | ⇒ | Closed |
Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2022-08-01 12:47:42 |
Closed_By | ⇒ | Fedik |
Hi, great, thank you, tested successfully, works great.
Thank you, Jan
Did you consider using a json.asset.file in your module? Then you can define the dependency. Not sure how this works in your environment.