जबकि Liviu Costea का उत्तर सही है, फिर भी मुझे यह पता लगाने में काफी समय लगा कि यह वास्तव में कैसे किया जाता है। तो यहाँ एक नया ASP.NET 4.5.2 MVC प्रोजेक्ट से शुरू होने वाला मेरा चरण-दर-चरण गाइड है। इस गाइड में बोवर का उपयोग करके क्लाइंट-साइड पैकेज प्रबंधन शामिल है लेकिन (अभी तक) बंडलिंग / ग्रंट / गल्प को कवर नहीं करता है।
चरण 1 (प्रोजेक्ट बनाएं)
Visual Studio 2015 के साथ एक नया ASP.NET 4.5.2 प्रोजेक्ट (MVC टेम्पलेट) बनाएँ।
चरण 2 (प्रोजेक्ट से बंडलिंग / ऑप्टिमाइज़ेशन निकालें)
चरण 2.1
निम्नलिखित Nuget संकुल अनइंस्टॉल करें:
- बूटस्ट्रैप
- Microsoft.jQuery.Unobstrusive.Validation
- jQuery.Validation
- jQuery
- Microsoft.AspNet.Web.Optimization
- WebGrease
- antlr
- Modernizr
- जवाब
चरण २.२
App_Start\BundleConfig.csप्रोजेक्ट से निकालें ।
चरण 2.3
हटाना
using System.Web.Optimization;
तथा
BundleConfig.RegisterBundles(BundleTable.Bundles);
से Global.asax.cs
चरण २.४
हटाना
<add namespace="System.Web.Optimization"/>
से Views\Web.config
चरण 2.5
के लिए System.Web.Optimizationऔर WebGreaseसे विधानसभा बाइंडिंग निकालेंWeb.config
चरण 3 (प्रोजेक्ट के लिए बोवर जोड़ें)
चरण 3.1
package.jsonप्रोजेक्ट ( NPM configuration fileआइटम टेम्पलेट) में नई फ़ाइल जोड़ें
चरण 3.2
जोड़े bowerको devDependencies:
{
"version": "1.0.0",
"name": "ASP.NET",
"private": true,
"devDependencies": {
"bower": "1.4.1"
}
}
package.jsonसहेजने पर बोवर पैकेज स्वचालित रूप से स्थापित हो जाता है।
चरण 4 (कॉन्फ़िगर बोवर)
चरण 4.1
bower.jsonप्रोजेक्ट ( Bower Configuration fileआइटम टेम्पलेट) में नई फ़ाइल जोड़ें
चरण 4.2
जोड़े bootstrap, jquery-validation-unobtrusive, modernizrऔर respondनिर्भरता के लिए:
{
"name": "ASP.NET",
"private": true,
"dependencies": {
"bootstrap": "*",
"jquery-validation-unobtrusive": "*",
"modernizr": "*",
"respond": "*"
}
}
ये पैकेज और उनकी निर्भरता bower.jsonसहेजे जाने पर स्वचालित रूप से स्थापित हो जाते हैं ।
चरण 5 (संशोधित करें Views\Shared\_Layout.cshtml)
चरण 5.1
बदलने के
@Styles.Render("~/Content/css")
साथ में
<link rel="stylesheet" href="~/wwwroot/lib/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="~/Content/Site.css" />
चरण 5.2
बदलने के
@Scripts.Render("~/bundles/modernizr")
साथ में
<script src="~/wwwroot/lib/modernizr/modernizr.js" ></script>
चरण 5.3
बदलने के
@Scripts.Render("~/bundles/jquery")
साथ में
<script src="~/wwwroot/lib/jquery/dist/jquery.min.js"></script>
कदम 5.4
बदलने के
@Scripts.Render("~/bundles/bootstrap")
साथ में
<script src="~/wwwroot/lib/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="~/wwwroot/lib/respond/dest/respond.min.js"></script>
चरण 6 (अन्य स्रोतों को संशोधित करें)
अन्य सभी दृश्यों की जगह
@Scripts.Render("~/bundles/jqueryval")
साथ में
<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>
उपयोगी कड़ियाँ
बंडलिंग और छोटा करना
नीचे टिप्पणी में LavaHot सिफारिश की गई है Bundler और minifier विस्तार डिफ़ॉल्ट बंडलर जो मैं कदम 2. उन्होंने यह भी सिफारिश की गई है में हटाने के लिए एक स्थानापन्न के रूप में इस लेख Gulp के साथ बांध दिया पर।