(此小说同时发布在本人微信公众号“dotNET每月朵华小说”,欢迎左边二维码来关怀。)

题记:ASP.NET
5和前边的ASP.NET版本有比比较大的两样,在那之中之一正是对前端库的管制不再选取Nuget,而是利用产业界常用的做法——依赖Bower来保管。那么哪些方便的增加前端库呢,明天就归纳分享一下自己的经验。

要经过Bower来加多前端库(以在此以前小说介绍过的MetroUI安装为例),打开项目下边包车型客车bower.json文件,在“dependencies”里面,加多一行描述:”metro”:
“三.0.五”。在输入包名的时候,VS会通过智能感知给出提醒,包蕴版本号的挑三拣四也会交到。最后代码如下:

{
  "name": "ASP.NET",
  "private": true,
  "dependencies": {
    "bootstrap": "3.3.4",
    "jquery": "1.10.2",
    "jquery-validation": "1.11.1",
    "jquery-validation-unobtrusive": "3.2.2",
    "hammer.js": "2.0.4",
    "bootstrap-touch-carousel": "0.8.0",
    "metro": "3.0.5"
  }
}

累加那行后,保存bower.json文件,VS就会自动去恢复生机MetroUI的包。打开项目中的“dependencies”节点下的“Bower”节点,就会看出“metro
(三.0.5)”的节点。依据网络状态和包大小,也许要求稍等一下,直到那一个节点前面包车型地铁“not
installed”字样消失,就表明包恢复生机成功了。假若自动回复有毛病,也能够点击那一个节点,从右键菜单中选拔“Update
Package”。

安装好的包,只是被下载到了品种文件夹中的“bower_components”文件夹中的相应文件夹。你还索要通过Gulp大概Grunt那样的任务实践器把包的揭露文件copy到lib目录下(lib目录是根据VS的习惯,你也得以选取别的目录)。由于VS默许项目模板使用的是居尔p,那么就张开gulpfile.js文件,找到“copy”这几个task。在“bower”里面,增加copy描述。由于MetroUI的宣布文件被停放了八个公文夹下“build”和“fonts”下,所以编写copy描述须要1些本事来处理八个文本夹的copy。具体看如下代码:

var bower = {
    "bootstrap": "bootstrap/dist/**/*.{js,map,css,ttf,svg,woff,eot}",
    "bootstrap-touch-carousel": "bootstrap-touch-carousel/dist/**/*.{js,css}",
    "hammer.js": "hammer.js/hammer*.{js,map}",
    "jquery": "jquery/jquery*.{js,map}",
    "jquery-validation": "jquery-validation/jquery.validate.js",
    "jquery-validation-unobtrusive": "jquery-validation-unobtrusive/jquery.validate.unobtrusive.js",
    "metro": "metro/build/**/*.{js,map,css}",
    "metro/fonts": "metro/fonts/*.{ttf,svg,woff,eot}"
  }

到家居尔p任务代码后,还亟需实施copy职务,来把metro的公布文件复制到wwwroot上边包车型的士现实性文件夹上边(在本例中是lib)。实行居尔p职分能够在“Task
Runner Explorer”中手动执行,也能够编写翻译消除方案或项目来机关推行。

聊起底,达成前端库的设置后,就是在HTML或视图像和文字件中援引,具体写法笔者就不重复了。

应该说,VS 201伍和ASP.NET
伍的前端开荒格局,既保障了现产业界流行的例行做法,又充裕发挥了Visual
Studio的精锐IDE成效,让大家增添前端库变得轻易。

相关文章

网站地图xml地图