1

我正在使用 Symfony 2 构建一个网站并使用 Less，就像这样

index.html.twig：

{% stylesheets
    '@AcmeWebappBundle/Resources/public/css/website.less'
    filter='?yui_css'
%}
<link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}

配置.yml：

assetic:
    filters:
        lessphp:
            file: %kernel.root_dir%/../vendor/lessphp/lessc.inc.php
            apply_to: "\.less$"

现在文件website.less增长了很多，所以我决定将它分成不同的文件，如下所示：

{% stylesheets
    '@AcmeWebappBundle/Resources/public/css/mixins.less'
    '@AcmeWebappBundle/Resources/public/css/general.less'
    '@AcmeWebappBundle/Resources/public/css/tasks.less'
    '@AcmeWebappBundle/Resources/public/css/notes.less'
    filter='?yui_css'
%}
<link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}

该文件mixins.less包含mixins我在其他文件中使用的所有内容。

问题是，如果我在 中引用 mixin notes.less，则无法识别 - 我相信这是因为 Assetic 仅在它正在编译的文件中搜索 mixin。顺便说一句，我使用的是lessphp，而不是node.js。

我该如何解决我的问题？如何使用 mixins.less 文件中声明的 mixins 拥有不同的 Less 文件？

4

1 回答 1

7

在您的示例中，您需要保留 website.less 并让它导入所有相关的 less 文件，如下所示：

网站.less：

/* import the necessary less files */
@import "mixins.less";
@import "general.less";
@import "tasks.less";
@import "notes.less";

index.html.twig：

{% stylesheets
    '@AcmeWebappBundle/Resources/public/css/website.less'
    filter='?yui_css'
%}
<link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}

这样，您可以为您的控制器或位于同一个包中的包减少几个文件，只需导入标记所需的相关文件（例如frontend.less，，，backend.less）mobile.less。

我鼓励您查看 Twitter Bootstrap 如何处理导入并很好地分离所有内容。

于 2012-06-10T08:23:12.860 回答