web-dev-qa-db-ja.com

ASP MVC 4 Bundles withScripts.Renderのscriptdefer属性を使用するにはどうすればよいですか？

GoogleとStackoverflowを調べましたが、これに対する答えは見つかりませんでした。バンドルを遅延として実行するための組み込みの方法はありますか、または誰かがこれを行うために作成した拡張ヘルパーメソッドを知っていますか？

javascriptasp.netasp.net-mvcperformanceasp.net-mvc-4
25
kyleb

Codeplexサイト または Nugetパッケージ を介してWeb最適化をバージョン1.1.0にアップグレードしてみてください

バージョン1.1.0では、要素テンプレート文字列が含まれていました。したがって、スクリプトタグにdefer属性を含める場合は、次のように簡単に実行できます。

@Scripts.RenderFormat("<script src='{0}' defer></script>","~/bundles/jquery")

次のマークアップが生成されます。

<script src="/Scripts/jquery-1.7.1.js" defer></script>
44
Diego Fernandez

上記の回答 は素晴らしいです。より簡潔な構文が必要な場合は、コードをここにすばやく貼り付けたいだけです。

新しいC＃クラスを追加します

// --------------------------------------------------------------------------------------------------------------------
// <copyright file="Scripts7.cs" company="Believe">
//   http://believeblog.azurewebsites.net/
// </copyright>
// --------------------------------------------------------------------------------------------------------------------

using System.Web;
using System.Web.Optimization;

namespace MVCExtension
{
    /// <summary>
    ///     The scripts.
    /// </summary>
    public static class Scripts
    {
        /// <summary>
        /// Render scripts as deferred
        /// </summary>
        /// <param name="paths">
        /// The paths.
        /// </param>
        /// <returns>
        /// The <see cref="IHtmlString"/>.
        /// </returns>
        public static IHtmlString RenderDefer(params string[] paths)
        {
            return Scripts.RenderFormat(@"<script src='{0}' defer></script>", paths);
        }
    }
}

次に、Razor構文を使用します。

@Scripts.RenderDefer("~/bundles/jquery")

またはWebform構文：

<%: Scripts.RenderDefer("~/bundles/jquery") %>
15
Believe2014

BundleTable.Bundles.ResolveBundleUrlを使用できます：

<script src="@(BundleTable.Bundles.ResolveBundleUrl("~/bundles/jquery"))" defer></script>
4
Yanga