基于Handlebars的最新版本实现Handlebars的预编译

至于Handlebars是什么东东,这里就不做过多解释,可以参照本站课程学习恶补。。。。

Handlebars入门课程传送门

http://www.gbtags.com/gb/gbliblist/7.htm
今天我们着中讲下如何预编译Handlebars模板,众所周知,如果在运行时去编译一些东西是非常影响性能的,Handlebars同样如此,如果每次都在加载页面的时候,在js中通过Handlebar.compile(template_source)的话,如果模板简单就不说了,如果模板非常复杂,夸张点说,让客户端的浏览器未响应也不是不可能。

好了,闲扯淡到此为止,开始动手。

     从Handlebars的官网http://handlebarsjs.com/precompilation.html 我们可以了解到,要实现Handlebars的预编译非常简单,只需要通过npm 安装他的npm包就可以了 npm install -g handlebars  (啥?npm不知道是啥?好吧,自行百度/google) .

这时候,handlebars的模板也不用再像入门教程中写的那样通过script标签嵌在Html的页面中了,我们需要把对应的模板写在对应的模板文件里面,handlebars的模板文件就是以.handlebars扩展名结尾的文件。比如有如下文件

sample.handlebars

其内容如下:
<div class="container">
    <div class="row">
        <div class="col-sm-2">名字</div>
        <div class="col-sm-10">{{name}}</div>
    </div>
</div>
Note: 这时候,模板内容就不用再包含在script标签中了。

然后只要在命令行如下命令即可 handlebars sample.handlebars -m -f  sample.hbs.js

这里我们对handlebars的命令做下简单的介绍,具体的可以参考github上的 https://github.com/wycats/handlebars.js/ 
Precompiling Templates

sample.handlebars 是输入源 文件,也就是我们写的模板文件
-m  参数是把预编译后压缩文件
-f   制定输出文件路径
sample.hbs.js  就是-f参数制定的输出文件

尊重笔者知识,转载请注明出处,文章全貌见链接:http://www.gbtags.com/gb/share/5764.htm

 

你可能感兴趣的:(编译)