ASP.NET MVC 5中的Bootstrap 3.1.1较少,EnableOptimizations为true时出错

时间:2014-05-21 18:27:17

标签: asp.net-mvc less asp.net-mvc-5

我在" ASP.NET MVC 5"中有一个项目。并使用" less" for" bootstrap 3.1.1",我使用以下库来减少文件并将其缩小:

http://www.nuget.org/packages/BundleTransformer.Core/ http://www.nuget.org/packages/BundleTransformer.Less/ http://www.nuget.org/packages/JavaScriptEngineSwitcher.Core/ http://www.nuget.org/packages/JavaScriptEngineSwitcher.Msie/ http://www.nuget.org/packages/MsieJavaScriptEngine/

我在MVC 4中有类似的proyect,但在MVC 5中我在BundleTable.EnableOptimizations中设置true是这样的:

public static void RegisterBundles(BundleCollection bundles)
{
    BundleTable.EnableOptimizations = true;

发生以下错误,不解释文件" less"使用变量,例如错误是:

Error type: Name
Message: variable @font-family-base is undefined
File: /Content/bootstrap/scaffolding.less
Line number: 29
Column number: 15
Source error:

Line 28: body {
Line 29:   font-family: @font-family-base;
-----------------------^
Line 30:   font-size: @font-size-base;

但如果我在/Content/bootstrap/scaffolding.less中包含/导入vars文件:

@import "variables.less";
@import "mixins.less";

错误没有发生,错误进入下一个文件。

修改

现在同样的事情发生在我身上,但是对于ASP.NET MVC 4,这些是我由nuget安装的库。我不明白问题是什么,或者是否有兼容的事情发生:

<package id="AjaxMin" version="5.6.5100.19204" targetFramework="net40" />
<package id="AngularJS.Core" version="1.2.16" targetFramework="net40" />
<package id="Antlr" version="3.5.0.2" targetFramework="net40" />
<package id="BundleTransformer.Core" version="1.8.17" targetFramework="net40" />
<package id="BundleTransformer.Less" version="1.8.14" targetFramework="net40" />
<package id="BundleTransformer.MicrosoftAjax" version="1.8.15" targetFramework="net40" />
<package id="FontAwesome" version="4.1.0" targetFramework="net40" />
<package id="JavaScriptEngineSwitcher.Core" version="0.9.5" targetFramework="net40" />
<package id="JavaScriptEngineSwitcher.Msie" version="0.9.5" targetFramework="net40" />
<package id="jQuery" version="1.10.2" targetFramework="net40" />
<package id="Microsoft.AspNet.Mvc" version="4.0.30506.0" targetFramework="net40" />
<package id="Microsoft.AspNet.Mvc.FixedDisplayModes" version="1.0.0" targetFramework="net40" />
<package id="Microsoft.AspNet.Razor" version="2.0.30506.0" targetFramework="net40" />
<package id="Microsoft.AspNet.Web.Optimization" version="1.1.3" targetFramework="net40" />
<package id="Microsoft.AspNet.WebApi" version="4.0.30506.0" targetFramework="net40" />
<package id="Microsoft.AspNet.WebApi.Client" version="4.0.30506.0" targetFramework="net40" />
<package id="Microsoft.AspNet.WebApi.Core" version="4.0.30506.0" targetFramework="net40" />
<package id="Microsoft.AspNet.WebApi.WebHost" version="4.0.30506.0" targetFramework="net40" />
<package id="Microsoft.AspNet.WebPages" version="2.0.30506.0" targetFramework="net40" />
<package id="Microsoft.Bcl" version="1.1.9" targetFramework="net40" />
<package id="Microsoft.Bcl.Build" version="1.0.14" targetFramework="net40" />
<package id="Microsoft.Net.Http" version="2.2.22" targetFramework="net40" />
<package id="Microsoft.Owin" version="2.1.0" targetFramework="net40" />
<package id="Microsoft.Web.Infrastructure" version="1.0.0.0" targetFramework="net40" />
<package id="Modernizr" version="2.7.2" targetFramework="net40" />
<package id="MsieJavaScriptEngine" version="1.1.3" targetFramework="net40" />
<package id="Newtonsoft.Json" version="6.0.1" targetFramework="net40" />
<package id="Owin" version="1.0" targetFramework="net40" />
<package id="Twitter.Bootstrap.Less" version="3.1.1" targetFramework="net40" />
<package id="WebActivatorEx" version="2.0" targetFramework="net40" />
<package id="WebGrease" version="1.5.2" targetFramework="net40" />

的web.config:

<sectionGroup name="bundleTransformer">
    <section name="core" type="BundleTransformer.Core.Configuration.CoreSettings, BundleTransformer.Core" />
    <section name="less" type="BundleTransformer.Less.Configuration.LessSettings, BundleTransformer.Less" />
  <section name="microsoftAjax" type="BundleTransformer.MicrosoftAjax.Configuration.MicrosoftAjaxSettings, BundleTransformer.MicrosoftAjax" />
</sectionGroup>
<sectionGroup name="jsEngineSwitcher">
    <section name="core" type="JavaScriptEngineSwitcher.Core.Configuration.CoreConfiguration, JavaScriptEngineSwitcher.Core" />
</sectionGroup>

...

<handlers>
  <add name="LessAssetHandler" path="*.less" verb="GET" type="BundleTransformer.Less.HttpHandlers.LessAssetHandler, BundleTransformer.Less" resourceType="File" preCondition="" />


...

<bundleTransformer xmlns="http://tempuri.org/BundleTransformer.Configuration.xsd">
  <core>
    <css defaultMinifier="MicrosoftAjaxCssMinifier">
      <minifiers>
        <add name="NullMinifier" type="BundleTransformer.Core.Minifiers.NullMinifier, BundleTransformer.Core" />
        <add name="MicrosoftAjaxCssMinifier" type="BundleTransformer.MicrosoftAjax.Minifiers.MicrosoftAjaxCssMinifier, BundleTransformer.MicrosoftAjax" />
      </minifiers>
      <translators>
        <add name="NullTranslator" type="BundleTransformer.Core.Translators.NullTranslator, BundleTransformer.Core" enabled="false" />
        <add name="LessTranslator" type="BundleTransformer.Less.Translators.LessTranslator, BundleTransformer.Less" />
      </translators>
    </css>
    <js defaultMinifier="MicrosoftAjaxJsMinifier">
      <minifiers>
        <add name="NullMinifier" type="BundleTransformer.Core.Minifiers.NullMinifier, BundleTransformer.Core" />
        <add name="MicrosoftAjaxJsMinifier" type="BundleTransformer.MicrosoftAjax.Minifiers.MicrosoftAjaxJsMinifier, BundleTransformer.MicrosoftAjax" />
      </minifiers>
      <translators>
        <add name="NullTranslator" type="BundleTransformer.Core.Translators.NullTranslator, BundleTransformer.Core" enabled="false" />
      </translators>
    </js>
  </core>
  <less useNativeMinification="false" ieCompat="true" strictMath="false" strictUnits="false" dumpLineNumbers="None">
    <jsEngine name="MsieJsEngine" />
  </less>
</bundleTransformer>
<jsEngineSwitcher xmlns="http://tempuri.org/JavaScriptEngineSwitcher.Configuration.xsd">
  <core>
    <engines>
      <add name="V8JsEngine" type="JavaScriptEngineSwitcher.V8.V8JsEngine, JavaScriptEngineSwitcher.V8" />
      <add name="MsieJsEngine" type="JavaScriptEngineSwitcher.Msie.MsieJsEngine, JavaScriptEngineSwitcher.Msie" />
    </engines>
  </core>
</jsEngineSwitcher>

编辑05-24-14

BundleConfig.cs是Css config的一部分:

CssTransformer cssTransformer = new CssTransformer();
NullOrderer nullOrderer = new NullOrderer();

Bundle cssBundle = new CustomStyleBundle(BundleName.Css);
cssBundle.Include("~/Content/bootstrap/bootstrap.less");
cssBundle.Include("~/Content/font-awesome.css");
cssBundle.Include("~/Content/site.less");
cssBundle.Transforms.Add(cssTransformer);
cssBundle.Orderer = nullOrderer;
bundles.Add(cssBundle);

1 个答案:

答案 0 :(得分:3)

问题是这样,在BundleConfig.cs中,以下配置无法正确解析less个文件。也许他们需要添加一些额外的属性,但它不起作用。

这是问题所在,如果此选项删除了less文件已正确处理。

//CssTransformer cssTransformer = new CssTransformer();
NullOrderer nullOrderer = new NullOrderer();

Bundle cssBundle = new CustomStyleBundle(BundleName.Css);
cssBundle.Include("~/Content/bootstrap/bootstrap.less");
cssBundle.Include("~/Content/font-awesome.css");
cssBundle.Include("~/Content/site.less");
//cssBundle.Transforms.Add(cssTransformer);
cssBundle.Orderer = nullOrderer;
bundles.Add(cssBundle);

我不知道“转换”的正确设置是什么,但删除它解决了我的问题,文件生成正确并且最小。