Jade:从主页以外的任何地方修改<head>

更新:

我也把这个问题发布到了Jade GitHub仓库。 我也把它放在这里,以供将来(循环)参考: https : //github.com/jadejs/jade/issues/1943

原文:

在一个默认的节点+ express + jade应用程序中,我正在尝试构build一些常用的可重用组件(菜单,页脚…),这些组件可以包含在一些页面中。 我试图从块或包含文件中添加对.css或.js文件的引用时被卡住了。 我想这样做,因为如果我不需要它们,我不想包含所有的样式和脚本。

文件夹结构是这样的:


    • 上市
      • JavaScript的
        • main.js
        • menu.js
      • 样式表
        • 的main.css
        • menu.css
    • 意见
      • 共享
        • layout.jade
        • menu.jade
        • footer.jade
      • index.jade

layout.jade文件:

doctype html html head title= title link(rel="stylesheet", href="stylesheets/main.css") script(src="javascripts/main.js") body block content 

index.jade文件:

 extends shared/layout block content h1= title p Welcome to #{title} 

在menu.jade中有一些代码需要menu.css和menu.js文件。

现在我只需要使用menu.jade文件,就可以将这些文件添加到页面的<head>中。

几个小时前我开始使用Jade,所以很有可能我在文档中遗漏了一些东西。

谢谢!

你可以用你的menu.js jQuery来做到这一点:

 $("head link[rel='stylesheet']").last().after("<link rel='stylesheet' href='stylesheets/menu.css' type='text/css'>"); 

然而,我会告诫你这种做法。 另一种方法是build立一个将所有CSS文件连接在一起的构build步骤,并将所有样式放在一个css文件中。 LESS和cssmin在这里是很好的select,他们有很好的模块来自动化你的咕噜咕噜或吞咽,无论你正在使用。

你提到如果你不需要它们,你不想包括所有的样式,但是我build议有一个web浏览器下载许多小的css文件比下载一个大的文件要慢,特别是如果你可以通过一个像使用gzip的nginx这样的web服务器来处理这些文件,或者你通过像CloudFront这样的CDN来提供你的静态文件。