Handlebars
为Sublime Text 2/3提供最完整的Handlebars.js模板支持。同时也为GitHub和Visual Studio Code中的语法着色提供支持。从:https://packagecontrol.sublime.net.cn/packages/Handlebars 安装。
详情
安装次数
- 总数 155K
- Win 45K
- Mac 82K
- Linux 28K
8月6日 | 8月5日 | 8月4日 | 8月3日 | 8月2日 | 8月1日 | 7月31日 | 7月30日 | 7月29日 | 7月28日 | 7月27日 | 7月26日 | 7月25日 | 7月24日 | 7月23日 | 7月22日 | 7月21日 | 7月20日 | 7月19日 | 7月18日 | 7月17日 | 7月16日 | 7月15日 | 7月14日 | 7月13日 | 7月12日 | 7月11日 | 7月10日 | 7月9日 | 7月8日 | 7月7日 | 7月6日 | 7月5日 | 7月4日 | 7月3日 | 7月2日 | 7月1日 | 6月30日 | 6月29日 | 6月28日 | 6月27日 | 6月26日 | 6月25日 | 6月24日 | 6月23日 | |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Windows | 0 | 0 | 0 | 1 | 1 | 0 | 2 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 5 | 2 | 2 | 0 | 1 | 0 | 5 | 1 | 0 | 0 | 1 | 2 | 4 | 1 | 0 | 0 | 0 | 1 | 0 | 1 | 0 | 0 | 3 | 0 | 0 | 2 | 1 | 0 | 2 | 1 | 0 |
Mac | 2 | 2 | 0 | 2 | 0 | 3 | 0 | 3 | 1 | 0 | 0 | 1 | 3 | 0 | 0 | 0 | 0 | 0 | 0 | 1 | 2 | 0 | 0 | 1 | 1 | 1 | 0 | 1 | 1 | 1 | 0 | 0 | 3 | 2 | 2 | 2 | 2 | 0 | 1 | 2 | 0 | 1 | 0 | 1 | 1 |
Linux | 0 | 0 | 0 | 0 | 1 | 0 | 0 | 0 | 2 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 1 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 2 | 1 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 1 | 0 | 2 | 0 | 1 | 0 | 1 |
README
Sublime Text 2/3 Handlebars.js套件
- Handlebars表达式颜色选自与周围HTML对比的色彩。
- Handlebars表达在HTML属性中也会得到语法高亮。
- 传递给块表达式的参数也会得到语法高亮。
- 它同时适用于单独的模板文件和script标签中的内联模板。
{{! Handlebars注释 }}
的快捷键绑定(仅Sublime Text有效)- Tab 触发
if
→{{#if }}
ifel
→{{#if }} {{else}}
el
→{{else}}
elif
→{{else if }}
un
→{{#unless }}
ea
→{{#each }}
wi
→{{#with }}
par
→{{> }}
(用于子模板)x-temp
→<script type="text/x-handlebars" data-template-name="$1">
(HTML文件中使用Ember推荐的数据-template-name属性的内联script标签)x-id
→<script type="text/x-handlebars-template" id="$1">
(HTML文件中使用旧版id属性的内联script标签)
(自2017年2月起,此存储库中的语法定义驱动着GitHub和Visual Studio Code中的高亮显示,因此可以打开与这两个相关的问题 😺)
关于Handlebars.js
这是一个出色的JavaScript模板引擎,基于Mustache,添加了预编译模板和创建自定义助手等能力。
官方网站: handlebarsjs.com
Sublime Text安装
如果您尚未使用它,请从上面的链接安装,然后
- 按 Shift + Cmd + P(OS X)或 Shift + Ctrl + P(Windows)
- 输入
install
,弹出Package Control: 安装包
选项,然后按 Enter 键 - 查找
Handlebars
,按 Enter 键安装它。 - 在有模板文件打开的情况下(或者在您使用了内联模板时,使用 Handlebars 代替 HTML,因为它优雅地扩展了功能,所以您应该不会丢失任何东西),在右下角选择
Handlebars
。 - 赚大了
从这一点开始,Package Control 也会自动更新该包!
已知问题和解决方案
Sublime:在关闭 HTML 标签时没有自动完成功能(#23 & #49)
问题:在关闭一个 HTML 标签时,在输入 /(或者在 OS X 上使用 Cmd + Alt + . 快捷键)后,标签名不会自动完成,尽管在与 HTML 包配合使用时,这是默认行为。
解决方案:安装Tag包可以重新启用这些功能,并且与这个包配合得很好。
Sublime:HTML 标签对没有高亮显示(#48)
问题:将光标移过 HTML 标签时不会高亮显示其成对项。
解决方案:安装BracketHighlighter包可以很好地解决这个问题,并且比内置的更强大的括号匹配。
Sublime:扩展选择到标签不工作(#47)
问题:扩展选择到标签不工作(Sublime 命令:expand_selection {"to": "tag"}
)。
解决方案:如果您安装了Emmet包,您可以按 Ctrl + D(OS X)或 Ctrl + Shift + A(Windows)来使用 Match Tag Pair
功能。
Sublime:.sublime-build
在构建系统菜单中(#73)
问题:在构建系统菜单中添加了一个无用且令人困惑的项目 .sublime-build
。这是由于包内部使用自定义构建配置以能够针对 Atom 和 Sublime,并将其暴露出来。尽管它仅用于开发,但 Sublime 似乎没有提供选项来隐藏它,因为包被安装了。
解决方案:通过在安装的文件夹中运行 zip -d Handlebars.sublime-package ".sublime-build"
或其他任何方式删除文件。
测试/贡献
我最近在日常工作中的 Handlebars 使用频率已经降低,因为我成为了父亲,因此任何贡献都极为欢迎!我仍然在使用 Github,所以我会确保继续对问题和提取请求保持响应。
在 test/
文件夹中有些示例模板。您可以在那里看到不同的受支持和尚未实现的使用案例。
Sublime Text
如果您想对该包进行工作,您应该从 Github 安装 PackageDev,或者从 Package Control 中安装。有了它,您可以编辑 JSON 版本(grammars/Handlebars.json
),并使用 ST Build System让它导出 Plist(grammars/Handlebars.tmLanguage
)。
Sublime Text 不使用 Plist 格式(grammars/Handlebars.tmLanguage
);而是使用 Sublime-Syntax 文件(grammars/Handlebars.sublime-syntax
)。该文件最初是用 Plugin Development: Convert Syntax to .sublime-syntax
Sublime 命令生成的,但随后由于修复 Sublime Text 特定错误而出现了分歧(#110)。理想情况下,这两个版本应该跟踪彼此,但会影响单一版本的 Pull Requests 仍然受到欢迎。
目前为止,我发现最好的开发环境是将软件包通过Package Control安装,然后将开发Git仓库符号链接到Sublime设置文件夹 > Packages
。这样就可以覆盖已安装的版本,方便您轻松切换。
最近我还发现了一个很棒的技巧:使用显示作用域名称
快捷键(OS X上为Shift + Ctrl + P,Windows上为Shift + Ctrl + Alt + P),这将根据光标位置在状态栏显示语言作用域。如果您厌倦了 siempre 按这些键,有一些非常出色的包可以自动完成这项任务,比如更加低调的ScopeAlways或功能更全面的ScopeHunter——注意:这两个都需要通过命令面板激活。
预编译
这个软件包没有提供任何Handlebars预编译功能,以保持事情简单,但您可以使用Ruby Guard(这是一个文件系统监视器)和Guard-Steering(一个Handlebars预编译器)在保存文件时自动预编译所有模板。
如果您想要整合,还有一个Sublime的Guard包,但我个人喜欢在终端窗口中使用Guard,因为它可以从任何地方访问。
当然,也有基于Node.js / Grunt / Gulp的编译器(例如这个和这个),但我个人还没有为预编译使用它们。
致谢
改编自尼古拉斯·韦斯特莱克(Nicholas Westlake)的出色sublime-text-handlebars包。
非常感谢所有慷慨的贡献者!
许可协议
(The MIT License)
特此无条件授权,免费向任何获得本软件及其相关文档文件(以下简称“软件”)的任何人,在包含但不仅限于使用、复制、修改、合并、出版、分发、再许可和/或销售软件副本的权利,以及允许向软件提供者的人士在遵守以下条件的情况下操作软件:
上述版权声明和本许可声明应包含在软件的所有副本或实质性部分中。
软件按“原版”提供,不保证任何形式,无论是明确的还是隐含的,包括但不限于适销性、针对特定目的的适用性和非侵权保证。在任何情况下,作者或版权所有者不应对任何索赔、损害或其他责任承担责任,无论是基于合同、侵权或其他行为,无论这些损害或责任是否源于、源于或与软件或其使用或其他操作有关。