zoukankan      html  css  js  c++  java
  • 在.NetCoreMvc3.1的View中动态AppendJs或Css文件

    首先看一下我的目录

     将页面Js挪到*.js文件中,然后使用扩展方法动态添加到页面

    @Html.AppendJsFile("/Views/Login/index.js")

    css文件

    @Html.AppendCssFile("/Views/Login/login.css")

    需要注意的事项:

    动态AppendJs或Css文件在发布时会遇到问题,找不到view目录下的Js或Css文件。

    原因是在.NetCoreMvc3.1中,发布后默认会将视图文件编译成*.Views.dll文件,同目录的js与css文件都会被打包,所以访问这些静态文件时就无法找到。

    解决办法:不编译视图文件
    1、通过nuget 安装引用Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation
    2、修改项目文件增加 <RazorCompileOnPublish>false</RazorCompileOnPublish>
    3、修改Startup.cs中方法ConfigureServices
    4、将js与css文件属性修改为始终复制到输出目录。

    扩展类

     1 //引用
     2 using System;
     3 using HJMinimally.Basic.Utility;
     4 using Microsoft.AspNetCore.Html;
     5 using Microsoft.AspNetCore.Mvc.Rendering;
     6 using System.Text;
     7 
     8 public static class HtmlHelperExtensions
     9     {
    10         /// <summary>
    11         /// 往页面中写入js文件
    12         /// </summary>
    13         /// <param name="htmlHelper">需要扩展对象</param>
    14         /// <param name="jsFiles">文件路径</param>
    15         /// <returns></returns>
    16         public static IHtmlContent AppendJsFile(this IHtmlHelper htmlHelper, params string[] jsFiles)
    17         {
    18             if (htmlHelper == null) throw new ArgumentNullException(nameof(htmlHelper));
    19             var jsStr = JsCssHelper.GetReadJsFile(jsFiles);
    20             var content = new StringBuilder();
    21             content.AppendFormat("<script>{0}</script>", jsStr);
    22             return new HtmlString(content.ToString());
    23         }
    24         /// <summary>
    25         /// 往页面中写入css样式
    26         /// </summary>
    27         /// <param name="htmlHelper">需要扩展对象</param>
    28         /// <param name="cssFiles">文件路径</param>
    29         /// <returns></returns>
    30         public static IHtmlContent AppendCssFile(this IHtmlHelper htmlHelper, params string[] cssFiles)
    31         {
    32             if (htmlHelper == null) throw new ArgumentNullException(nameof(htmlHelper));
    33             var url = GlobalContext.HostingEnvironment.ContentRootPath;
    34             var cssStr = JsCssHelper.GetReadCssFile(cssFiles);
    35             if (url != "/")
    36             {
    37                 cssStr = cssStr.Replace("url(", "url(" + url);
    38             }
    39             var content = new StringBuilder();
    40             content.AppendFormat("<style>{0}</style>", cssStr);
    41             return new HtmlString(content.ToString());
    42         }
    43     }

    引用包:YUICompressor.NET

     1 //引用
     2 using System;
     3 using System.IO;
     4 using System.Text;
     5 using Yahoo.Yui.Compressor;
     6 
     7 public class JsCssHelper
     8     {
     9         private static readonly JavaScriptCompressor JsCompressor = new JavaScriptCompressor();
    10         private static readonly CssCompressor CssCompressor = new CssCompressor();
    11 
    12         #region Js 文件操作
    13         /// <summary>
    14         /// 读取js文件内容并压缩
    15         /// </summary>
    16         /// <param name="filePathList"></param>
    17         /// <returns></returns>
    18         public static string GetReadJsFile(string[] filePathList)
    19         {
    20             var jsStr = new StringBuilder();
    21             try
    22             {
    23                 var rootPath = GlobalContext.HostingEnvironment.ContentRootPath;//项目根目录,我这边是从IWebHostEnvironment HostingEnvironment拿到的
    24                 foreach (var filePath in filePathList)
    25                 {
    26                     var path = rootPath + filePath;
    27                     if (!File.Exists(path)) continue;
    28                     var content = File.ReadAllText(path, Encoding.UTF8);
    29                     if (GlobalContext.AppSetting.JsCssCompressor)
    30                     {
    31                         content = JsCompressor.Compress(content);
    32                     }
    33                     jsStr.Append(content);
    34                 }
    35 
    36                 return jsStr.ToString();
    37             }
    38             catch (Exception)
    39             {
    40                 return string.Empty;
    41             }
    42         }
    43         #endregion
    44 
    45         #region Css 文件操作
    46         /// <summary>
    47         /// 读取css 文件内容并压缩
    48         /// </summary>
    49         /// <param name="filePathList"></param>
    50         /// <returns></returns>
    51         public static string GetReadCssFile(string[] filePathList)
    52         {
    53             var cssStr = new StringBuilder();
    54             try
    55             {
    56                 var rootPath = GlobalContext.HostingEnvironment.ContentRootPath;//IWebHostEnvironment HostingEnvironment
    57                 foreach (var filePath in filePathList)
    58                 {
    59                     var path = rootPath + filePath;
    60                     if (!File.Exists(path)) continue;
    61                     var content = File.ReadAllText(path, Encoding.UTF8);
    62                     if (GlobalContext.AppSetting.JsCssCompressor)
    63                     {
    64                         content = CssCompressor.Compress(content);
    65                     }
    66                     cssStr.Append(content);
    67                 }
    68                 return cssStr.ToString();
    69             }
    70             catch (Exception)
    71             {
    72                 return string.Empty;
    73             }
    74         }
    75         #endregion
    76     }
  • 相关阅读:
    BeautifulSoup中的select方法
    BeautifulSoup中的find,find_all
    python中sys.stdout、sys.stdin
    python sort、sorted
    Numpy常用操作
    pandas (loc、iloc、ix)的区别
    小波变化库——Pywalvets学习笔记
    python filter()函数
    Redis数据库总结
    高逼格企业级MySQL数据库备份方案,原来是这样....
  • 原文地址:https://www.cnblogs.com/liuzeqi/p/14294346.html
Copyright © 2011-2022 走看看