web-dev-qa-db-ja.com

MVC4 @ Styles.Render（）がデバッグモードで期待どおりに動作しないのはなぜですか

私はMVC4にバンドリングとミニファイのサポートを実装し、それが私のBootstrap .lessファイルを自動的にコンパイルできるように設定しています。BundleConfig.csファイルに次のコードがあります。

public class BundleConfig
{
    public static void RegisterBundles(BundleCollection bundles)
    {
        // base bundles that come with MVC 4

        var bootstrapBundle = new Bundle("~/bundles/bootstrap").Include("~/Content/less/bootstrap.less");
        bootstrapBundle.Transforms.Add(new TwitterBootstrapLessTransform());
        bootstrapBundle.Transforms.Add(new CssMinify());
        bundles.Add(bootstrapBundle);
    }
}

TwitterBootsrapLessTransformは次のとおりです（サブ.lessファイルをdotLessにインポートする必要があるため、思ったよりも複雑です）。

public class TwitterBootstrapLessTransform : IBundleTransform
{
    public static string BundlePath { get; private set; }

    public void Process(BundleContext context, BundleResponse response)
    {
        setBasePath(context);

        var config = new DotlessConfiguration(DotlessConfiguration.GetDefault());
        config.LessSource = typeof(TwitterBootstrapLessMinifyBundleFileReader);

        response.Content = Less.Parse(response.Content, config);
        response.ContentType = "text/css";
    }

    private void setBasePath(BundleContext context)
    {
        BundlePath = context.HttpContext.Server.MapPath("~/Content/less" + "/imports" + "/");
    }
}

public class TwitterBootstrapLessMinifyBundleFileReader : IFileReader
{
    public IPathResolver PathResolver { get; set; }
    private string basePath;

    public TwitterBootstrapLessMinifyBundleFileReader(): this(new RelativePathResolver())
    {
    }

    public TwitterBootstrapLessMinifyBundleFileReader(IPathResolver pathResolver)
    {
        PathResolver = pathResolver;
        basePath = TwitterBootstrapLessTransform.BundlePath;
    }

    public bool DoesFileExist(string fileName)
    {
        fileName = PathResolver.GetFullPath(basePath + fileName);

        return File.Exists(fileName);
    }

    public byte[] GetBinaryFileContents(string fileName)
    {
        throw new System.NotImplementedException();
    }

    public string GetFileContents(string fileName)
    {
        fileName = PathResolver.GetFullPath(basePath + fileName);

        return File.ReadAllText(fileName);
    }
}

私のベースの_Layout.cshtmlページで、これを実行してcssファイルをレンダリングしようとしました

@Styles.Render("~/bundles/bootstrap");

mvc tutorial で提案されているように、クライアントブラウザが要求してしまうファイルは

http://localhost:53729/Content/less/bootstrap.less

これによりエラーが発生します。次のリンクをベースレイアウトページに挿入すると、期待どおりに動作します。

<link href="~/bundles/bootstrap" rel="stylesheet" type="text/css" />

@ Styles.Render（）がデバッグモードで同じように動作しないのはなぜですか？リリースモードで動作します。デバッグでバンドルして縮小したくない場合は理解できますが、このバンドルを常に同じように動作させるにはどうすればよいですか？

asp.net-mvc-4bundling-and-minificationasp.net-optimization
17
PlTaylor

私がやったことは、_Layout.cshtmlにデバッグifステートメントを入れて、バンドルが何に関係なくレンダリングされるようにすることでした。私はそれを解決策として夢中ではありませんが、今のところ機能しています。

@if (Context.IsDebuggingEnabled)
{
    <link href="~/bundles/bootstrap" rel="stylesheet" type="text/css" />
}
else
{
    @Styles.Render("~/bundles/bootstrap")
}
10
PlTaylor

したがって、基本的にdebug="true"の場合、スクリプト/スタイルのレンダリングメソッドは、最適化がオフであることを前提としています。つまり、バンドリングも縮小も行われません。代わりに、それはバンドルの生のコンテンツへのリンクをレンダリングするだけです（あなたの場合はboostrap.lessです）。

BundleTable.EnableOptimizations = trueを設定することで、この動作をオーバーライドして常に最適化を実行できます。これにより、レンダリングメソッドは常にバンドリング/ミニファイを行うようになります。

31
Hao Kung

Dotlessに.lessファイルを提供させることで、これを回避します

web.config：

   <handlers>
    <add name="dotless" path="*.less" verb="GET" type="dotless.Core.LessCssHttpHandler,dotless.Core" resourceType="File" preCondition="" />
    </handlers>
4
chrisortman