.NET Razor类库 - 静态资源组件化

2024-08-26 16:44

本文主要是介绍.NET Razor类库 - 静态资源组件化,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

1. 找到Razor类库

打开VS2022 文件 - 新建 - 项目 或者 使用 Ctrl+Shift+N  快捷键
输入Razor 搜索  ,	选中Razor类库,	点击 下一步

在这里插入图片描述

2.创建Razor类库项目

输入项目名称 IX.RCL.Front
RCL 是 RazorClassLibrary的简称意思
Front 代表前端静态资源的意思
位置是 F盘 LocalCode文件夹
F:\LocalCode
解决方案名称 IX.RCL.Front
点击下一步
在这里插入图片描述
在这里插入图片描述

3. 创建一个MVC Web项目 (ASP.NET Core Web(模型-视图-控制器) )

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

设置MVC Web项目为 启动项目
在这里插入图片描述

4.在Razor 类库项目 添加静态文件

css,images,js lib 等 添加 wwwroot 文件夹,注意这个文件夹 命名暂时保持固定 不要改变在wwwroot文件夹下建立3个文件夹css		存放可以共享给其他项目使用的css样式images	存放可以共享给其他项目使用的静态图片lib		存放可以共享给其他项目使用的 js给css 中 添加一些公共的样式  放在 ix.css 文件中给images 中添加一个 公共的图片	bg.png给lib 中添加 几个 公共的jsjQuery.js jquery.cookie.jsjquery.hz2py.js 汉字转拼音

在这里插入图片描述

5. MVC项目引用 Razor类库项目

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

通过上边步骤 我们创建了 css images js 的公共静态资源接下来我们就说一下该如何使用找到 全局的母版页 _Layout.cshtml把多余的我们不需要的HTML删掉,只保留想保留的部分在模板也中 添加 Css 的 SectionScripts 的 Section 默认生成就有,不用我们自己添加了

在这里插入图片描述

6. 在MVC Web项目 /home/index 引用 组件化的静态资源

在Index.cshtml中 加入 Css 和 Scripts 的引用@section Css	在Css中 引入 自定义的 ix.css  和 My97 日历控件@section Scripts在scripts中引入 My97日历的js文件把首页的Html代码 修改一下  改为 我们自己想展示的代码 如图从图中可以看到 我们应用了很多 ix.css 中的 样式运行 IX.RCL.Front.Web 项目 我们看一下 效果

在这里插入图片描述

7.查看运行结果

 从运行的 Web站点来看css images 、日历控件的js 的引用 均 来自 Razor 类库

在这里插入图片描述

总结

掌握了 Razor类库 静态资源组件化 这个技能之后
我们可以把JS css images 等静态资源 打包成 NuGet
所有人都引用公用的NuGet
就可以确保项目中引用的静态资源的版本一致性,便于管理

附录

Razor类库 也可以当成一个MVC项目 ,把 视图 模型 控制器 组件化 开发。

这篇关于.NET Razor类库 - 静态资源组件化的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1109120

相关文章

解决未解析的依赖项:‘net.sf.json-lib:json-lib:jar:2.4‘问题

《解决未解析的依赖项:‘net.sf.json-lib:json-lib:jar:2.4‘问题》:本文主要介绍解决未解析的依赖项:‘net.sf.json-lib:json-lib:jar:2.4... 目录未解析的依赖项:‘net.sf.json-lib:json-lib:jar:2.4‘打开pom.XM

javax.net.ssl.SSLHandshakeException:异常原因及解决方案

《javax.net.ssl.SSLHandshakeException:异常原因及解决方案》javax.net.ssl.SSLHandshakeException是一个SSL握手异常,通常在建立SS... 目录报错原因在程序中绕过服务器的安全验证注意点最后多说一句报错原因一般出现这种问题是因为目标服务器

C++中RAII资源获取即初始化

《C++中RAII资源获取即初始化》RAII通过构造/析构自动管理资源生命周期,确保安全释放,本文就来介绍一下C++中的RAII技术及其应用,具有一定的参考价值,感兴趣的可以了解一下... 目录一、核心原理与机制二、标准库中的RAII实现三、自定义RAII类设计原则四、常见应用场景1. 内存管理2. 文件操

Spring组件实例化扩展点之InstantiationAwareBeanPostProcessor使用场景解析

《Spring组件实例化扩展点之InstantiationAwareBeanPostProcessor使用场景解析》InstantiationAwareBeanPostProcessor是Spring... 目录一、什么是InstantiationAwareBeanPostProcessor?二、核心方法解

C++ RabbitMq消息队列组件详解

《C++RabbitMq消息队列组件详解》:本文主要介绍C++RabbitMq消息队列组件的相关知识,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录1. RabbitMq介绍2. 安装RabbitMQ3. 安装 RabbitMQ 的 C++客户端库4. A

PyQt6中QMainWindow组件的使用详解

《PyQt6中QMainWindow组件的使用详解》QMainWindow是PyQt6中用于构建桌面应用程序的基础组件,本文主要介绍了PyQt6中QMainWindow组件的使用,具有一定的参考价值,... 目录1. QMainWindow 组php件概述2. 使用 QMainWindow3. QMainW

使用easy connect之后,maven无法使用,原来需要配置-Djava.net.preferIPv4Stack=true问题

《使用easyconnect之后,maven无法使用,原来需要配置-Djava.net.preferIPv4Stack=true问题》:本文主要介绍使用easyconnect之后,maven无法... 目录使用easGWowCy connect之后,maven无法使用,原来需要配置-DJava.net.pr

在.NET平台使用C#为PDF添加各种类型的表单域的方法

《在.NET平台使用C#为PDF添加各种类型的表单域的方法》在日常办公系统开发中,涉及PDF处理相关的开发时,生成可填写的PDF表单是一种常见需求,与静态PDF不同,带有**表单域的文档支持用户直接在... 目录引言使用 PdfTextBoxField 添加文本输入域使用 PdfComboBoxField

Vue3组件中getCurrentInstance()获取App实例,但是返回null的解决方案

《Vue3组件中getCurrentInstance()获取App实例,但是返回null的解决方案》:本文主要介绍Vue3组件中getCurrentInstance()获取App实例,但是返回nu... 目录vue3组件中getCurrentInstajavascriptnce()获取App实例,但是返回n

SpringQuartz定时任务核心组件JobDetail与Trigger配置

《SpringQuartz定时任务核心组件JobDetail与Trigger配置》Spring框架与Quartz调度器的集成提供了强大而灵活的定时任务解决方案,本文主要介绍了SpringQuartz定... 目录引言一、Spring Quartz基础架构1.1 核心组件概述1.2 Spring集成优势二、J