Nodejs中对 jade 的看法

Nodejs中对 jade 的看法

写了几天jade,对jade有点看法; 字符串后面接标签,只能将标签另起一行,或者直接写完整的标签。比方说<span>text<input type=“text”></span> 就只能写成

    span
       text<input type="text">

或者

    span
       text
       input(type="text")

用zencoding只要

 span>{text}+input

在写jade时常常得在简洁的写法是忍受这样的不简洁,很是难受;还有比方说if somekey如果写在其他地方就必须用#{somekey},不统一的样子。这显然不想是个完成品因该有的样子。写到这里,我想jade的设计是什么,不就是简洁以及语义化代码。现在并不能体现这些, 只像是个python的半吊子模仿品。


14 回复

Node.js 中对 Jade 的看法

Jade(现已更名为 Pug)是一种流行的模板引擎,用于简化 HTML 生成。然而,在使用过程中,我发现了一些不太满意的地方,这些问题可能会影响开发体验。

1. 标签嵌套问题

Jade 对标签的嵌套方式有一些严格的限制。例如,当你希望在一个标签内包含另一个标签时,需要特别注意换行符和缩进。这与一些其他工具(如 Zen Coding)相比显得不够直观。

示例:

假设我们希望创建一个包含文本和输入框的 <span> 标签:

// 错误的写法
span
  text<input type="text">

// 正确的写法
span
  text
  input(type="text")

// 使用 Zen Coding 的写法
span>{text}+input

在上面的例子中,text<input type="text"> 这种写法会导致编译错误。正确的写法是将 input 标签单独写在一行,或者使用更简洁的 Zen Coding 写法。

2. 条件判断语法

在 Jade 中,条件判断语法(如 if somekey)也有一定的限制。如果 somekey 是一个变量,你需要使用 #{somekey} 来引用它。这种语法在不同的上下文中表现不一致,可能会导致混淆。

示例:

// 如果 somekey 存在,则显示特定内容
if somekey
  p #{somekey}
else
  p No key found

在这个例子中,if somekey#{somekey} 的使用方式不同,这在一定程度上破坏了代码的一致性和简洁性。

总结

尽管 Jade 在某些方面确实简化了 HTML 生成,但其严格的标签嵌套规则和条件判断语法的不一致性可能会让开发者感到不便。个人认为,Jade 在设计上追求简洁和语义化代码,但在实际使用中并没有完全达到预期的效果。因此,如果你正在寻找一个更加灵活和统一的模板引擎,可以考虑其他选择,如 EJS 或者 Nunjucks。

希望这些观点对你有所帮助!


这只能说明你不熟悉feature

好好的HTML不写……

呵呵,u can u up

zencoding 只是编码时的辅助工具,如果要把这样的东西作为模板语言,可读性太差了,尤其是与各种属性、变量混合在一起的时候。 对模板语言来说,简洁并不是唯一,越简洁意味着解析/编译时越慢。 jade 强制你缩进,还可以避免过多嵌套。

试试 swig吧!我觉得蛮好~

和楼主一样的抱怨,现在用swig了,上楼都不费劲了,一次可以蹦五楼

如果你不熟悉一个事物,不要急着对它下定义:“只像是个python的半吊子模仿品。”

显然楼主没认真看 jade 的文档,对于你遇到的这个问题是可以这样的解决的:

a(href='/ticket/list/')
    span.glyphicon.pull-right.glyphicon-edit
    | #{t('ticket.')}

任何一个html template engine 离html太远了 都显得不友好了,这是我不喜欢jade的原因

个人用jade只是喜欢缩进…

pythoner表示一切以缩进作为code blocker的东西都值得赞一个==~

这…槽吐的太纯了

关于 Node.js 中使用 Jade(现已更名为 Pug)的看法,确实有一些开发者认为它在某些方面存在一些不便之处。例如,在处理字符串后面接标签的情况时,Jade 要求你必须将标签单独另起一行,或以完整形式编写,这可能会破坏简洁性。另外,条件语句的使用也需要遵循特定格式,这可能会影响代码的可读性和一致性。

示例代码

以下是一些简单的例子来说明这两种情况:

字符串后接标签

正如你提到的,Jade 在处理这种情况时需要特殊格式:

// 正确方式
span
  | text
  input(type="text")

// 或者
span
  | text<input type="text">

相比之下,使用 Zen Coding 可以更简洁地实现相同的效果:

span>text+input

条件语句

在 Jade 中,条件语句也必须符合特定语法:

- if (somekey)
  p #{somekey}
- else
  p default

如果 somekey 不在条件判断语句中使用 ${} 占位符,则无法正确插入变量值。

对 Jade 的看法

尽管 Jade/Pug 在某些方面显得不够灵活,但它仍然有许多优点。例如,它强调语义化和简洁性,使得 HTML 结构更加清晰和易于维护。此外,Jade/Pug 拥有一系列强大的功能,如混合语言支持、过滤器等,可以显著提高开发效率。

如果你觉得 Jade/Pug 的某些特性让你感到不适,可以考虑使用其他模板引擎,如 EJS 或 Nunjucks,它们可能更适合你的需求。

总之,每个工具都有其适用场景,重要的是根据项目需求和个人偏好选择合适的工具。

回到顶部