前端库使用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. 安装前端库的更多相关文章

  1. 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/ ...

  2. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 12. Views 下

    ASP.NET Core MVC 13. 安装前端库 Partial VIew 就是部分View,他没有自己的数据,数据来自图中白色的那块,它的数据需要传进去,第一个参数是View的名称,第二个参数就 ...

  3. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 25. 过滤器

    在MVC的请求管道 并不是  asp.net core的请求管道.所以说Filter是专用于MVC的 贯穿特性,横穿关注点.比如授权.日志 这里的Authorize其实就是一个Filter,主要用来授 ...

  4. 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 ...

  5. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 04. 中间件

    注册startup类可以配置我们web应用的启动逻辑,使用的就是UseStartUp方法,asp.net core就会实例化这个类 并调用startup类里面的两个方法ConfigureService ...

  6. 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/ 这是中文的地址 创建一个项目 名称.描述 ...

  7. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 01. 创建项目 +项目结构和配置简介

    新建项目:Tutotial.Web 解决方案名称可以把web去掉 视频里面把git这个选项勾选了.我就不勾选了 dotnet CLI创建项目 首先必须安装好了.net Core的SDK dotnet ...

  8. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 05.Controller 的路由

    视频地址: https://www.bilibili.com/video/av38392956/?p=5 这里面就包含了MVC相关的库 可以通过打开右侧的Nuget库进行查看 这里修改下 ,只需要静态 ...

  9. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 06. Controller 返回View

    Controller父类会提供很多上下文的相关信息,还提供了很多封装的方法 返回的对象要求实现了IActionResult接口 继承父类,并引入命名空间 写this点就出现很多东西,这些就是上下文的信 ...

随机推荐

  1. 自动化中间人攻击工具subterfuge小实验

    Subterfuge是一款用python写的中间人攻击框架,它集成了一个前端和收集了一些著名的可用于中间人攻击的安全工具. Subterfuge主要调用的是sslstrip,sslstrip 是08 ...

  2. Proximal Gradient Descent for L1 Regularization(近端梯度下降求解L1正则化问题)

    假设我们要求解以下的最小化问题: $min_xf(x)$ 如果$f(x)$可导,那么一个简单的方法是使用Gradient Descent (GD)方法,也即使用以下的式子进行迭代求解: $x_{k+1 ...

  3. Python基础语法06--文件

    Python 文件I/O 本章只讲述所有基本的的I/O函数,更多函数请参考Python标准文档. 打印到屏幕 最简单的输出方法是用print语句,你可以给它传递零个或多个用逗号隔开的表达式.此函数把你 ...

  4. postgresql 导出建表语句的方法-类似describe table

    https://www.youtube.com/watch?v=PMfcsYzj-9M  这个视频不错, The Definitive Guide to Object-Oriented JavaScr ...

  5. C# step by step 学习笔记8 CHAPTER 9 使用枚举和结构创建值类型

    C# 2012 step by step 学习笔记8 CHAPTER 9 使用枚举和结构创建值类型 本章内容 声明一个枚举类型 创建并使用一个枚举类型 声明一个结构类型 创建并使用一个结构类型 解释结 ...

  6. hdu 2795(单点改动)

    题意:有h×w大的公告板.有n条公告要写入,每条公告高度都是1,宽度是wi,每次从最上最左的空位写,假设有空位输出第几行.假设没有足够空位输出-1. 题解:注意h最大1e9.但事实上是看n的大小.由于 ...

  7. Mesa (computer graphics)

    http://en.wikipedia.org/wiki/Mesa_(computer_graphics) Mesa (computer graphics) From Wikipedia, the f ...

  8. freeIPMI README && issue about OpenIPMI kernel driver

    http://www.gnu.org/software/freeipmi/README FreeIPMI - Copyright (C) 2003-2013 FreeIPMI Core Team Fr ...

  9. u-boot简单学习笔记(二)——AR9331 uboot.lds分析

    最开始系统上电后 从uboot.lds开始引导 OUTPUT_FORMAT("elf32-tradbigmips", "elf32-tradbigmips", ...

  10. 【配置关系】—Entity Framework实例详解

    实体间的关系,简单来说无非就是一对一.一对多.多对多,根据方向性来说又分为双向和单向.Code First在实体关系上有以下约定: 1. 两个实体,如果一个实体包含一个引用属性,另一个实体包含一个集合 ...