CSS 文件的顺序。在主题的 CSS 之前加载模块的 CSS

Question

如何更改 CSS 文件的顺序以加载模块的 CSS在主题的 CSS 之前？以下是一些代码示例：

主题的 CSS 文件（加载在所有页面上）添加到主题的 local.xml 中：

<default>
    <reference name="head">
        <action method="addItem">
            <type>skin_css</type>
            <name>css/theme.css</name>
        </action>
    </reference>
</default>

扩展的 CSS 文件（仅在类别页面上加载）添加到模块的 XML 布局文件中：

<catalog_category_layered>
    <reference name="head">
        <action method="addItem">
            <type>skin_css</type>
            <name>css/extension.css</name>
        </action>
    </reference>
</catalog_category_layered>

这是我在分类页面上加载的 CSS 文件的顺序，扩展的 CSS 在主题的 CSS 之后加载：

• /default/mytheme/css/styles.css
• /default/mytheme/css/theme.css
• /default/mytheme/css/extension.css

我想要实现的目标：扩展的 CSS 在主题的 CSS 之前加载。
如何强制 CSS 文件的这种顺序：

• /default/mytheme/css/styles.css
• /default/mytheme/css/extension.css
• /default/mytheme/css/theme.css

我注意到，如果我安装了许多扩展，则某些扩展的 CSS 在主题的 CSS 之前加载，而其他一些扩展的 CSS 在主题的 CSS 之后加载。我认为这与 Magento 中模块的顺序有关，但我不明白如何影响前端 CSS（或 JavaScript）文件的顺序。

Answer 1

这里有两点我将首先详细说明：1) 加载布局 XML 文件的顺序和 2) 处理布局 句柄 的顺序。

1 - 按加载扩展的顺序加载布局 xml 文件。按字母顺序加载扩展（因为服务器读取 app/etc/extensions 中的文件)，但是当有模块依赖时，被另一个模块所依赖的模块将首先被加载。 Magento 实际上循环遍历所有这些 XML 文件两次以实现此目的。第一次读取所有扩展，第二次按依赖顺序加载它们/然后所有剩余的按字母顺序加载。 local.xml 但是是一种特殊情况，并且总是最后加载，因此它的指令优先于任何扩展的布局指令。

现在我知道你在想什么“如果 local.xml 是最后加载的，为什么扩展的 CSS 文件会在之后加载？”那是由于以下原因...

2 - 布局句柄的处理顺序。这就是在这种特殊情况下的作用。尽管 local.xml 是在 扩展的布局文件之后加载的，但这是因为扩展的目标是“catalog_category_layered”布局句柄。此布局句柄在布局句柄“默认”之后处理。正因为如此，您会遇到扩展的 CSS 文件在主题的 CSS 文件之后加载的问题。

那么解决办法是什么？很简单，虽然有点烦人。在您的 local.xml 文件中，您只需要定位此布局句柄并首先删除您的主题的 CSS 文件，然后重新添加它。

这应该对你有用：

<catalog_category_layered>
    <reference name="head">
        <action method="removeItem">
            <type>skin_css</type>
            <name>css/theme.css</name>
        </action>
        <action method="addItem">
            <type>skin_css</type>
            <name>css/theme.css</name>
        </action>
    </reference>
</catalog_category_layered>

您的网站将在此布局句柄内按照扩展程序的说明处理这些说明。因此，您的 CSS 文件也会在之后加载。

Answer 2

也许这有帮助

Theme Precedence / Priority