ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 13. 安装前端库
前端库使用npm进行安装,需要先建立webpack.json文件


因为我们没有使用npm安装任何库,所以npm的文件夹是空的

这里是用于开发时构建时引用的库写在这里

这里用到bootStrap 开发时和发布时都要用的所以要放到这里

自己写上,BootStrap的版本号是自己去官网看的

点击保存后npm 就会自动在左下角进行安装了

会依赖的库都安装好了

存放包的模块司机是跟目录的node_modules文件夹下。VS会把这个文件夹排除,因为是不需要加入到源码库的

bootStrap安装到这里,怎么引用呢,早asp.core里面 视图文件应该是是放在wwwroot里面的

为了简单就把node_modules文件件当做一个类似于wwwroot一样。当做静态的视图文件夹
StartUp里面设置的app.UseStaticFiles()可以让wwwroot文件夹内的文件对外可见,让里面的东西可以对外视图

修改,这个中间件只会对路径包含/node_modules为路径进行处理。如果不包含就直接跳到下一个中间件

其实还有一个OverLoad方法可以直接写path路径就可以。但是这么写不知道到哪去找静态文件

所以还是用第一种写法,如果找到物理文件呢?需要用到FileProvier
参数里面需要传递一个物理路径

这里面参数要求是一个绝对路径

这样就可以找到node_modules文件夹

找到对应的文件,直接拖过来

这是拖进来之后的效果

使用一些bootstrap的组件,表明bootstrap起作用了,使用一下Navbar直接把代码copy过去


运行页面测试,报错,这里前面多写了一个斜线

效果出来了

可以看到bootstrap已经加载进来了
前端的验证
表单提交的时候,如何做前端的验证,不提交到后端,在前端验证。
这时候需要用到另外几个前端的库

把三个文件拖进来放在最下面,body结束标签的上面

引入三个组件后,form的前端验证自动就好了。
没有任何网络请求的情况 验证出

可以使用cdm把常用的库放在里面进行引用


使用tagHelper
表示开发环境下要把代码加进去

表示开发的时候本地的这几个js。

exclude非开发环境

cdn如果挂了。这时候有个回落机制,一旦cdn无法访问,就使用本地的这个路径
通过判断window.jQuery这个对象存不存在,来表示cdn是否可以正常访问

其他的两个js需要判断的情况

css的判断

ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 13. 安装前端库的更多相关文章
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 03. 服务注册和管道
ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 03. 服务注册和管道 语雀: https://www.yuque.com/yuejiangliu/dotnet/ ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 12. Views 下
ASP.NET Core MVC 13. 安装前端库 Partial VIew 就是部分View,他没有自己的数据,数据来自图中白色的那块,它的数据需要传进去,第一个参数是View的名称,第二个参数就 ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 25. 过滤器
在MVC的请求管道 并不是 asp.net core的请求管道.所以说Filter是专用于MVC的 贯穿特性,横穿关注点.比如授权.日志 这里的Authorize其实就是一个Filter,主要用来授 ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 02. Web Host 的默认配置
视频地址: https://www.bilibili.com/video/av38392956/?p=2 语雀 https://www.yuque.com/yuejiangliu/dotnet/ixt ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 04. 中间件
注册startup类可以配置我们web应用的启动逻辑,使用的就是UseStartUp方法,asp.net core就会实例化这个类 并调用startup类里面的两个方法ConfigureService ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 27. CICD Azure DevOps
VSTS做持续集成 后来改名叫做Azure Deveps https://azure.microsoft.com/zh-cn/services/devops/ 这是中文的地址 创建一个项目 名称.描述 ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 01. 创建项目 +项目结构和配置简介
新建项目:Tutotial.Web 解决方案名称可以把web去掉 视频里面把git这个选项勾选了.我就不勾选了 dotnet CLI创建项目 首先必须安装好了.net Core的SDK dotnet ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 05.Controller 的路由
视频地址: https://www.bilibili.com/video/av38392956/?p=5 这里面就包含了MVC相关的库 可以通过打开右侧的Nuget库进行查看 这里修改下 ,只需要静态 ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 06. Controller 返回View
Controller父类会提供很多上下文的相关信息,还提供了很多封装的方法 返回的对象要求实现了IActionResult接口 继承父类,并引入命名空间 写this点就出现很多东西,这些就是上下文的信 ...
随机推荐
- 【powerdesign】从mysql数据库导出到powerdesign,生成数据字典
使用版本powerdesign16.5,mysql 5.5,windows 64 =========================================================== ...
- Java并发编程(三)volatile域
相关文章 Java并发编程(一)线程定义.状态和属性 Java并发编程(二)同步 Android多线程(一)线程池 Android多线程(二)AsyncTask源代码分析 前言 有时仅仅为了读写一个或 ...
- GridView的经常使用属性
1.android:numColumns="auto_fit" //GridView的列数设置为自己主动 2.android:columnWidth="90dp &q ...
- ucgui界面设计演示样例2
ucgui界面设计演示样例2 本文博客链接:http://blog.csdn.net/jdh99,作者:jdh,转载请注明. 环境: 主机:WIN8 开发环境:MDK4.72 ucgui版本号:3 ...
- VMWare 14 Workstation Pro 下载与安装
1.双击安装运行 2.下一步 3.接受 下一步 4.自定义安装路径,下一步 5.下一步,取消勾选加入vmware客户体验 6.下一步 7.安装 8.安装中 9.完成 10.点击许可证安装 输入:FF3 ...
- zabbix基于SNMP 协议监控路由器
zabbix基于SNMP 协议监控路由器 步骤 步骤超级方便. 1. 路由器上开启snmp 2. 确保外网能訪问到 3. 用snmpwalk測试 4. 加入zabbix主机,SNMP interfac ...
- DRF框架
1.RESTful规范 1.1 REST风格:表属性状态转移 1.1.1资源:在web中凡是有被引用的必要的都叫资源 1.1.2 URI:统一资源标识符 URI包含URL 1.1.3 URL:统 ...
- Struts2的运行流程及其工作原理
1 服务开启,配置文件初始化 2 用户访问login请求 3 进入web.xml文件中我们配置的核心控制器(filter) 4 核心过滤器中有一个FilterDispatcher,FilterDisp ...
- POJ2155 Matrix 二维线段树
关键词:线段树 二维线段树维护一个 维护一个X线段的线段树,每个X节点维护一个 维护一个Y线段的线段树. 注意,以下代码没有PushDownX.因为如果要这么做,PushDownX时,由于当前X节点的 ...
- Node安装及搭建简单HTTP服务器
注:本文安装系统为mac,windows及其他系统下载对应安装包 ,mac下载后的安装包为apk文件,windows为msi文件. 安装 1.在网上下载node安装包,官方网站2.双击下载文件,按步骤 ...