명시적인 ScriptBundle 포함 순서를 어떻게 지정할 수 있습니까?

명시적인 ScriptBundle 포함 순서를 어떻게 지정할 수 있습니까?

---

나는 밖으로 시도하고 MVC4 System.Web.Optimization 1.0 ScriptBundle 기능을 .

다음 구성이 있습니다.

public class BundleConfig
{
    public static void RegisterBundles(BundleCollection bundles)
    {
        // shared scripts
        Bundle canvasScripts =
            new ScriptBundle(BundlePaths.CanvasScripts)
                .Include("~/Scripts/modernizr-*")
                .Include("~/Scripts/json2.js")
                .Include("~/Scripts/columnizer.js")
                .Include("~/Scripts/jquery.ui.message.min.js")
                .Include("~/Scripts/Shared/achievements.js")
                .Include("~/Scripts/Shared/canvas.js");
        bundles.Add(canvasScripts);
    }
}

및 다음보기 :

<script type="text/javascript" src="@Scripts.Url(BundlePaths.CanvasScripts)"></script>

어디 BundlePaths.CanvasScripts입니다 "~/bundles/scripts/canvas". 다음을 렌더링합니다.

<script type="text/javascript" src="/bundles/scripts/canvas?v=UTH3XqH0UXWjJzi-gtX03eU183BJNpFNg8anioG14_41"></script>

지금까지는 ~/Scripts/Shared/achievements.js번들 된 소스의 첫 번째 스크립트를 제외하고 는 훌륭 합니다. 이전에 포함 된 모든 스크립트에 따라 ScriptBundle. 번들에 include 문을 추가하는 순서를 준수하는지 어떻게 확인할 수 있습니까?

최신 정보

이것은 비교적 새로운 ASP.NET MVC 4 응용 프로그램 이었지만 최적화 프레임 워크 사전 릴리스 패키지를 참조하고있었습니다. 나는 그것을 제거하고 http://nuget.org/packages/Microsoft.AspNet.Web.Optimization 에서 RTM 패키지를 추가했습니다 . web.config에서 debug = true 인 RTM 버전을 사용 @Scripts.Render("~/bundles/scripts/canvas")하면 개별 스크립트 태그를 올바른 순서로 렌더링합니다.

web.config에서 debug = false를 사용하면 결합 된 스크립트가 먼저 achievements.js 스크립트를 가지지 만 나중에 호출되는 함수 정의 (객체 생성자)이므로 오류없이 실행됩니다. 아마도 미니 파이어가 의존성을 알아낼만큼 똑똑할까요?

또한 IBundleOrdererDarin Dimitrov가 두 디버그 옵션을 사용하여 RTM에서 제안한 구현을 시도 했으며 동일하게 작동했습니다.

따라서 축소 된 버전은 예상 한 순서가 아니지만 작동합니다.

---

RTM 비트에서이 동작이 보이지 않습니다. Microsoft ASP.NET 웹 최적화 프레임 워크 1.0.0 비트를 사용하고 있습니까? http://nuget.org/packages/Microsoft.AspNet.Web.Optimization ?

새로운 MVC4 인터넷 응용 프로그램 웹 사이트를 기반으로 샘플과 유사한 재현을 사용했습니다.

BundleConfig.RegisterBundles에 추가했습니다.

        Bundle canvasScripts =
            new ScriptBundle("~/bundles/scripts/canvas")
                .Include("~/Scripts/modernizr-*")
                .Include("~/Scripts/Shared/achievements.js")
                .Include("~/Scripts/Shared/canvas.js");
        bundles.Add(canvasScripts); 

그런 다음 기본 색인 페이지에서 다음을 추가했습니다.

<script src="@Scripts.Url("~/bundles/scripts/canvas")"></script>

그리고 번들의 축소 된 자바 스크립트에서 achievements.js의 내용이 modernizr 이후임을 확인했습니다.

---

IBundleOrderer등록한 순서에 번들이 포함되도록 하는 사용자 지정 번들 주문자 ( )를 작성할 수 있습니다.

public class AsIsBundleOrderer : IBundleOrderer
{
    public virtual IEnumerable<FileInfo> OrderFiles(BundleContext context, IEnumerable<FileInfo> files)
    {
        return files;
    }
}

그리고:

public class BundleConfig
{
    public static void RegisterBundles(BundleCollection bundles)
    {
        var bundle = new Bundle("~/bundles/scripts/canvas");
        bundle.Orderer = new AsIsBundleOrderer();
        bundle
            .Include("~/Scripts/modernizr-*")
            .Include("~/Scripts/json2.js")
            .Include("~/Scripts/columnizer.js")
            .Include("~/Scripts/jquery.ui.message.min.js")
            .Include("~/Scripts/Shared/achievements.js")
            .Include("~/Scripts/Shared/canvas.js");
        bundles.Add(bundle);
    }
}

그리고 당신의 관점에서 :

@Scripts.Render("~/bundles/scripts/canvas")

---

다린 감사합니다. 확장 방법을 추가했습니다.

internal class AsIsBundleOrderer : IBundleOrderer
{
    public virtual IEnumerable<FileInfo> OrderFiles(BundleContext context, IEnumerable<FileInfo> files)
    {
        return files;
    }
}

internal static class BundleExtensions
{
    public static Bundle ForceOrdered(this Bundle sb)
    {
        sb.Orderer = new AsIsBundleOrderer();
        return sb;
    }
}

용법

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js",
                    "~/Scripts/jquery-migrate-{version}.js",

                    "~/Scripts/jquery.validate.js",
                    "~/Scripts/jquery.validate.messages_fr.js",
                    "~/Scripts/moon.jquery.validation-{version}.js",

                    "~/Scripts/jquery-ui-{version}.js"
                    ).ForceOrdered());

---

MVC 5 (BundleFile vs FileInfo)의 변경 사항을 처리하기 위해 SoftLion에서 제공하는 답변을 업데이트했습니다.

internal class AsIsBundleOrderer : IBundleOrderer
{
    public virtual IEnumerable<BundleFile> OrderFiles(BundleContext context, IEnumerable<BundleFile> files)
    {
        return files;
    }
}

internal static class BundleExtensions
{
    public static Bundle ForceOrdered(this Bundle sb)
    {
        sb.Orderer = new AsIsBundleOrderer();
        return sb;
    }
}

용법:

    bundles.Add(new ScriptBundle("~/content/js/site")
        .Include("~/content/scripts/jquery-{version}.js")
        .Include("~/content/scripts/bootstrap-{version}.js")
        .Include("~/content/scripts/jquery.validate-{version}")
        .ForceOrdered());

I like using fluent syntax but it also works with a single method call and all the scripts passed as parameters.

---

You should be able to set the order with help of the BundleCollection.FileSetOrderList. Have a look at this blog post: http://weblogs.asp.net/imranbaloch/archive/2012/09/30/hidden-options-of-asp-net-bundling-and-minification.aspx . The code in your instance would be something like:

BundleFileSetOrdering bundleFileSetOrdering = new BundleFileSetOrdering("js");
bundleFileSetOrdering.Files.Add("~/Scripts/modernizr-*");
bundleFileSetOrdering.Files.Add("~/Scripts/json2.js");
bundleFileSetOrdering.Files.Add("~/Scripts/columnizer.js");
bundleFileSetOrdering.Files.Add("~/Scripts/jquery.ui.message.min.js");
bundleFileSetOrdering.Files.Add("~/Scripts/Shared/achievements.js");
bundleFileSetOrdering.Files.Add("~/Scripts/Shared/canvas.js");
bundles.FileSetOrderList.Add(bundleFileSetOrdering);

---

You should consider using Cassette http://getcassette.net/ It supports auto detection of script dependencies based on script references found inside each file.

If you prefer sticking to MS Web Optimization solution but like the idea of arranging scripts based on script references you should read my blog post at http://blogs.microsoft.co.il/oric/2013/12/27/building-single-page-application-bundle-orderer/

---

@Darin Dimitrov's answer works perfectly for me, but my project is written in VB, so here's his answer converted to VB

Public Class AsIsBundleOrderer
    Implements IBundleOrderer

    Public Function IBundleOrderer_OrderFiles(ByVal context As BundleContext, ByVal files As IEnumerable(Of FileInfo)) As IEnumerable(Of FileInfo) Implements IBundleOrderer.OrderFiles
        Return files
    End Function
End Class

To Use it:

Dim scriptBundleMain = New ScriptBundle("~/Scripts/myBundle")
scriptBundleMain.Orderer = New AsIsBundleOrderer()
scriptBundleMain.Include(
    "~/Scripts/file1.js",
    "~/Scripts/file2.js"
)
bundles.Add(scriptBundleMain)

참고URL : https://stackoverflow.com/questions/11979718/how-can-i-specify-an-explicit-scriptbundle-include-order