9

我希望我没有创建重复的主题,但是我已经搜索了两天,找不到解决方案。

我们正在MVC4中启动一个新项目,并且加载了较少版本的引导程序。我遇到的问题是当我尝试引用bootstrap.less、 myglobal.less或当前文件之外的任何内容中的某些类或变量时。我可以在当前文件的顶部创建一个变量并很好地使用它,但是如果我想使用单独文件中的某些东西,我必须这样@import做。如果我的整个应用程序的 less 文件都在一个文件中,这会很好,但我必须将 4+ 个文件 @import 到我创建的每个 page/sectionless 文件中。

我从https://gist.github.com/2002958添加了 MVC4 捆绑添加

正如我所看到的,问题是每个文件都被独立评估并转换为css。我试图简化该过程并从 less 包中的所有文件构建大量的 less 字符串,然后将它们转换(Less.Parse(lessString)),但我收到了错误:

“您正在导入一个无法找到的以 .less 结尾的文件”

所以这是我的终极问题:有没有一种方法可以在不引用物理文件的情况下简单地解析更少的字符串?那将解决我的问题。

如果由于某种奇怪的原因而无法做到这一点,是否有一个我不知道的组件或流程已经到位,它实际上在缩小文件之前将文件捆绑在一起?

任何关于这个主题的光都将不胜感激,因为我正在绕着圈子试图让它发挥作用。

这个问题也发布在 Dotless 组:
https ://groups.google.com/forum/?fromgroups#!topic/dotless/j-8OP1dNjUY

4

2 回答 2

3

这个解决方案对我有用:

我有两个 NuGet 包:
- dotless
-dotless adapter for system.web.optimization

在我的web.config中,我有以下几行:

<configuration>
    <configSections>
        <section name="dotless" 
                 type="dotless.Core.configuration.DotlessConfigurationSectionHandler, dotless.Core" />
    </configSections>
    <system.web>
        <httpHandlers>
            <add path="*.less"
                 verb="GET"
                 type="dotless.Core.LessCssHttpHandler, dotless.Core" />
        </httpHandlers>
    </system.web>
    <system.webServer>
        <validation validateIntegratedModeConfiguration="false" />
        <handlers>
            <add name="dotless" 
                 path="*.less" 
                 verb="GET" 
                 type="dotless.Core.LessCssHttpHandler,dotless.Core" 
                 resourceType="File" 
                 preCondition="" />
        </handlers>
    </system.webServer>
    <dotless minifyCss="true" cache="true" web="false" disableParameters="true" />
</configuration>

请注意,您应该根据需要定义无点参数。

BundleConfig.cs

public static void RegisterBundles(BundleCollection bundles)
{
    bundles.Add(new LessBundle("~/bundles/styles/").Include("~/Content/site.less"));
    BundleTable.EnableOptimizations = true; // false if you want to debug css
}

最后,Site.less

/* I have to redefine some bootstrap mixins and variables,
   so importing bootstrap and extending happens here: */
@import "bootstrap-extends.less";

/* all other needed less should be included here too, for example:
   @import "admin.less";
   @import "controls.less";
   etc
*/

body {

}

site.less并且bootstrap-extends.less位于 Content 文件夹内。 bootstrap-extends包含所有需要@import的指令,这些指令通常列在~/Content/bootstrap/bootstrap.less.

于 2015-06-26T07:36:17.473 回答
1

您是否研究过LESS 捆绑变压器

于 2013-12-11T22:46:19.050 回答