Issue with style script ordering

Topics: Customizing Orchard, Troubleshooting, Writing modules, Writing themes
Jan 6, 2012 at 7:47 PM
Edited Jan 6, 2012 at 7:48 PM





One of my Views has this:




In the browser the HTML comes out like this:


<link href="/Modules/mymodule/Styles/search.css" rel="stylesheet" type="text/css" />

<link href="/Modules/mymodule/Styles/advanced_search.css" rel="stylesheet" type="text/css" />

<link href="/Modules/mymodule/Styles/validationEngine.jquery.css" rel="stylesheet" type="text/css" />

<link href="/Themes/MyTheme/Styles/ge-main.css" rel="stylesheet" type="text/css" />

<meta content="Orchard" name="generator" />

<link href="/Modules/mymodule/styles/jquery-1.8.16/css/flick/jquery-ui-1.8.16.customflick.css" rel="stylesheet" type="text/css" />


The problem is that in the HTML, the jquery UI Flick script comes after all the other ones, even though I called Style.Require for it before Validation Engine. I've tried all sorts of stuff like defining dependencies -- I even tried setting dependencies in both directions and it appears that it does nothing for the css scripts. That is, i tried this:




And this:




And in both cases the jquery UI Flick css is rendered after all the other css files, and after the <meta name="generator" value="Orchard"/> tag. It always comes out *after* that meta tag for some reason. I'm not referencing this Flick css anywhere else but on this page. I tried using Style.Include for all the css too, but I had the same problem. I thought I could fix it by converting all the resource references to using ResourceManifest.cs and declaring dependencies between them but that seems to do nothing or at least not work how one would expect it.

What am I doing wrong? It's probably something simple... .



Jan 6, 2012 at 7:49 PM

I am using the latest 1.x branch as of mid day, 1/6/2021. 

Jan 6, 2012 at 8:30 PM

Not sure if this might help someone troubleshoot, but in the rendered HTML, the "/Styles/" part of the path to the CSS for the jQueryFlick.css always comes out in all lower case, but "Styles" is capitalized in the paths for four .css files before it. 

In my REsourceManifest.cs, the "Style" part of the path is lowercase for all the scripts (still messing with this, now I have tried defining all the paths as absolute): 

The only difference I can see is that this flick css is in a subfolder, so I'm going to try moving it up to the same level as the others. 

Jan 6, 2012 at 8:31 PM
Edited Jan 6, 2012 at 8:32 PM

The order in which you require is irrelevant. If you need a specifc order for loading things that is a dependency, that should be declared in the resource manifest.

If dependencies have no effect, please file a bug.

Jan 6, 2012 at 8:39 PM

Seems like a bug. Once I moved the script from /Styles/jquery-1.8.16/css/flick/ to /Styles it started being included in the correct order. 

Jan 6, 2012 at 8:43 PM

Does Orchard automatically pull in a reference to dependencies (even if I don't call Require on them), or is dependency only used for the order of the scripts that are explicitly required? 

Jan 6, 2012 at 8:48 PM

Bug filed:

Jan 6, 2012 at 8:57 PM

Yes, Orchard automatically injects your dependencies so you don't need to explicitly require them.