首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Pug中嵌套的includes drop块内容位于错误的位置

Pug是一种高性能的模板引擎,用于生成HTML。它具有简洁的语法和强大的功能,可以帮助开发人员更高效地构建网页。

在Pug中,可以使用include指令来引入其他Pug文件的内容。而include指令中的drop块用于指定引入的文件中的内容应该插入到何处。

然而,当在Pug中嵌套的includes中使用drop块时,如果内容位于错误的位置,可能会导致渲染结果不符合预期。

为了解决这个问题,可以按照以下步骤进行调整:

  1. 确保include指令正确引入了目标文件。可以使用相对路径或绝对路径来指定文件位置。
  2. 确认目标文件中的drop块是否位于正确的位置。drop块应该在目标文件中的合适位置,以确保被正确插入到当前文件中。
  3. 检查目标文件中是否存在其他可能导致错误位置的代码。有时,其他代码可能会干扰drop块的正确插入位置,需要进行适当的调整。

总结起来,要解决Pug中嵌套的includesdrop块内容位于错误位置的问题,需要确保正确引入目标文件,并确认drop块位于目标文件中的正确位置。如果问题仍然存在,需要仔细检查其他可能导致错误位置的代码。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Butterfly布局调整———相关推荐版块侧栏卡片化

更新记录 2021-12-15:正式版v1.0 重写related_posts.js文件,沿用最新文章的布局 调整与相关教程的联动内容 思路解析 之前一直没有留意到,butterfly的原生相关推荐版块和其他布局比起来实在是太突兀了...说干就干,首先,要定位这个侧栏卡片的源码位置,用F12确定了它的class为relatedPosts,然后在主题源码里全局搜索,发现这个居然不是在pug中生成,而是通过一个hexo的helper函数来处理的...然后就是找到related_posts.js中关于html代码构建的部分,按照上面分析出的骨架和现有的变量进行拼装就OK了。...diff 代码块 改动完成的代码块 2.因为原本的版块是在文章下方,而现在我们需要把它改到侧栏。...所以需要修改[Blogroot]\themes\butterfly\layout\post.pug大约 26 行的位置先移除在文章底部的推荐版块。

1K50
  • 魔改笔记七:分类条及外链卡片

    碎碎念 最近广泛交友,在和朋友klcdm的聊天中,了解到了他按照洪哥的教程添加了一个分类条,于是我想要,在和星港的聊天中,了解到他又有改了加载动画,而我的加载动画还是可怜的原版动画,于是心动的我又想要了...然后将其添加到不同的位置,比如我这里实现了添加到分类页面等位置,配合上pjax可以做到无刷更新,效果很好,打开文件[BlogRoot]\themes\butterfly\layout\category.pug.../pagination.pug 注意上方的修改,需要将配置文件中,分类页面的主题改成index,否则不会显示。...includes/categoryBar.pug +postUI include includes/pagination.pug 然后就是实现点击切换后,高亮部分跟随分类页面走的部分,...如: 这是这篇文章的参考文章对应标签,由于直接添加文字会被错误识别,这里仅放图片,可以对照着查看,这里不再多做解释。

    13410

    Hexo-Butterfly主题魔改

    \head.pug的内容 在 //- font 的配置下 //- global config 的配置上的空白部分写入以下代码(请直接复制粘贴,避免出现缩进错误 ❌) //- animate_css if...\additional-js.pug文件内部的内容 在 if theme.pjax.enable 配置大项的 baidu-push 小项下写入一下代码(请直接复制粘贴,避免出现缩进错误 ❌) V3.4.0.../bilibili-banner.pug 6.修改%brt\%config%\_config.butterfly.yml(请将%config%替换为你主题配置文件的位置,如果在根目录请无视) 找到 CDN...1.前往%brt\themes\butterfly\layout\includes\新建一个名为gitcalendar.pug的文件 在其内部添加以下代码(请直接复制粘贴,避免缩进错误 ❌): #gitcalendar.gitcalendar...\butterfly\layout\includes\的additional-js.pug文件 在 script(src=url_for(theme.CDN.utils))的上面加入以下内容 script

    2.6K20

    Botui Talk Robot

    botui.js 是一个简单的聊天机器人框架,使用它可以完成简易的脚本对话式交流。缺点是只能在自己设定的逻辑内进行有限问答,而不是像真正的 AI 那样智能会话。 ?...botui.js简介 静态资源下载 **由于本教程涉及的所有修改对缩进格式等有严格要求,担心自己控制不好的可以直接下载静态资源,将压缩包内的butterfly文件夹复制到[Blogroot]\theme...\目录下覆盖现有主题文件夹即可跳过以下教程的前4步,直接到主题配置文件_config.butterfly.yml中参照第5、6两步修改配置项。...可以自定义修改按钮显示的内容。 修改~\[blogroot]\themes\butterfly\layout\includes\widget\index.pug,注意对齐格式。...在~\[blogroot]\themes\butterfly\languages\zh-CN.yml中添加相应译名 可能遇到的bug 无法显示 切换页面侧栏就变成空白

    48010

    Hexo + Butterfly 侧边栏公众号

    本人用的是npm方式安装的 hexo-theme-butterfly,后续魔改时更改的文件都是【BlogRoot/node_modules/hexo-theme-butterfly】文件夹中的文件。...步骤 在BlogRoot/node_modules/hexo-theme-butterfly/layout/includes/widget文件夹下新建card_wx.pug文件, 具体位置如下图:.../widget/index.pug中引入上一步中创建的card_wx.pug文件。...具体位置如下图: 将以下代码复制到自定义的custom.css中,不会自定义css的请阅读 Hexo + Butterfly 一些常见问题 一文中关于【关于自定义的 js 和 css 文件】部分。...important中的#49b1f5换成你自己的主题色,另外还需要将 https://bu.dusays.com/2022/10/30/635e9c6a228a3.png 这个图片中的二维码部分换成你自己公众号的二维码

    59700
    领券