DNN 模块中的 CSS答案

【问题标题】：CSS In DNN ModulesDNN 模块中的 CSS
【发布时间】：2012-12-08 18:06:52
【问题描述】：

如何在 DotnetNuke 中包含特定模块的自定义 css 和 JavaScript？

我知道它不像普通的 ASP.Net 页面。

【问题讨论】：

【解决方案1】：

如果您的模块在模块文件夹的根目录中有一个名为module.css 的文件，它将自动包含在该模块所在的页面中。

对于其他 CSS 和 JavaScript，您应该使用 Client Resource Management framework 来包含您想要的资源。像这样的：

<%@ Register TagPrefix="dnn" 
    Namespace="DotNetNuke.Web.Client.ClientResourceManagement" 
    Assembly="DotNetNuke.Web.Client" %>
 
<dnn:DnnCssInclude runat="server"
    FilePath="~/DesktopModules/MyModule/css/the-style.css" />
<dnn:DnnJsInclude runat="server"
    FilePath="~/DesktopModules/MyModule/js/the-script.js"
    ForceProvider="DnnFormBottomProvider" />

【讨论】：

嗨！我找到了您关于 DnnCssInclude 的答案并使用了它，它几乎可以完美运行。但是我确实有一个小问题，我想知道你是否可以帮忙。我的情况：我有一个包含 asp.net 向导的控件，并且我为该向导使用了自定义 css。第一次加载时，某些 css（不是全部）无法正确加载（在此处查看屏幕截图：awesomescreenshot.com/0293xq5k49）。当我单击一个按钮时，页面会进行回发，然后正确应用 css（在此处查看屏幕截图：awesomescreenshot.com/0773xq5t90）。有什么想法吗？
@PanagiotisPalladinos 我认为如果某些 CSS 正在加载，它可能与页面上的其他内容发生冲突，而不是您如何加载 CSS 的问题

【解决方案2】：

你也可以这样用：

<link rel="stylesheet" type="text/css" href="<%= ControlPath %>/module.css" />

【讨论】：

【解决方案3】：

将外部 JavaScript 添加到自定义模块：

string externaJs= "externaJs";
Type cstype = System.Reflection.MethodBase.GetCurrentMethod().GetType();
string cstext = "<script src=\"" +
                ResolveUrl("~/DesktopModules/ModuleName/js/JsName.js") +
                "\" type=\"text/javascript\"></script>";

if (!Page.ClientScript.IsClientScriptBlockRegistered(externaJs))
   Page.ClientScript.RegisterClientScriptBlock(cstype, externaJs, cstext, false);

【讨论】：

这是非常手动的，不能很好地扩展。 DNN 有一个 API 可以使用客户端依赖框架来做同样的事情，以允许最小化、聚合和缓存，代码更少，代码可重用性更高，并且具有更好的扩展能力。