Chociaż odpowiedź Liviu Costei jest prawidłowa, to i tak Zajęło mi trochę czasu, aby dowiedzieć się, jak to się właściwie robi. Oto mój przewodnik krok po kroku, zaczynając od nowego ASP.NET 4.5.2 projekt MVC. Ten przewodnik obejmuje zarządzanie pakietami po stronie klienta za pomocą bowera, ale nie obejmuje (jeszcze) łączenia/grunt/gulp.

Krok 1 (Utwórz Projekt)

Utwórz nowy ASP.NET 4.5.2 projekt (szablon MVC) z Visual Studio 2015.

Krok 2 (Usuń Wiązanie / Optymalizację z projektu)

Krok 2.1

Odinstaluj następujące pakiety Nuget:

• bootstrap
• Microsoft.jQuery.Dyskretny.Walidacja
• jQuery.Walidacja
• jQuery
• Microsoft.AspNet.Www.Optymalizacja
• WebGrease
• Antlr
• Modernizr
• Odpowiedz

Krok 2.2

Usuń App_Start\BundleConfig.cs z projektu.

Krok 2.3

Usuń

using System.Web.Optimization;

I

BundleConfig.RegisterBundles(BundleTable.Bundles);

Z Global.asax.cs

Krok 2.4

Usuń

<add namespace="System.Web.Optimization"/>

Z Views\Web.config

Krok 2.5

Usuń wiązania Montażowe dla System.Web.Optimization i WebGrease z Web.config

Krok 3 (Dodaj altanę do projektu)

Krok 3.1

Dodaj nowy plik package.json do projektu (NPM configuration file szablon pozycji)

Krok 3.2

Dodaj bower do devDependencies:

{
  "version": "1.0.0",
  "name": "ASP.NET",
  "private": true,
  "devDependencies": {
    "bower": "1.4.1"
  }
}

Pakiet bower jest automatycznie zainstalowany po zapisaniu package.json.

Krok 4 (Konfiguracja bowera)

Krok 4.1

Dodaj nowy plik bower.json do projektu (Bower Configuration file szablon pozycji)

Krok 4.2

Dodaj bootstrap, jquery-validation-unobtrusive, modernizr i respond do zależności:

{
  "name": "ASP.NET",
  "private": true,
  "dependencies": {
    "bootstrap": "*",
    "jquery-validation-unobtrusive": "*",
    "modernizr": "*",
    "respond": "*"
  }
}

Te pakiety i ich zależności są instalowane automatycznie po zapisaniu bower.json.

Krok 5 (Modify Views\Shared\_Layout.cshtml)

Krok 5.1

Zastąp

@Styles.Render("~/Content/css")

Z

<link rel="stylesheet" href="~/wwwroot/lib/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="~/Content/Site.css" />

Krok 5.2

Zastąp

@Scripts.Render("~/bundles/modernizr")

Z

<script src="~/wwwroot/lib/modernizr/modernizr.js" ></script>

Krok 5.3

Zastąp

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

Z

<script src="~/wwwroot/lib/jquery/dist/jquery.min.js"></script>

Krok 5.4

Zastąp

@Scripts.Render("~/bundles/bootstrap")

Z

<script src="~/wwwroot/lib/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="~/wwwroot/lib/respond/dest/respond.min.js"></script>

Krok 6 (Modyfikuj inne źródła)

We wszystkich innych widokach zastąp

@Scripts.Render("~/bundles/jqueryval")

Z

<script src="~/wwwroot/lib/jquery-validation/dist/jquery.validate.min.js"></script>
<script src="~/wwwroot/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>

Przydatne & Minifikacja

W komentarzach poniżej LavaHot zaleca rozszerzenieBundler & Minifier jako zamiennik domyślnego bundlera, który usuwam w Kroku 2. Poleca również ten artykuł na temat łączenia z Gulp.