npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

etpl

v3.2.0

Published

ETPL是一个强复用、灵活、高性能的JavaScript模板引擎,适用于浏览器端或Node环境中视图的生成。

Downloads

385

Readme

ETPL (Enterprise Template)

Build Status

ETPL是一个强复用、灵活、高性能的JavaScript模板引擎,适用于浏览器端或Node环境中视图的生成。

Download

除了通过github clone外,你可以通过右键另存的方式获得ETpl:

也可以通过CDN引用:

<script src="http://s1.bdstatic.com/r/www/cache/ecom/etpl/3-2-0/etpl.js"></script>

Start

ETpl可以在CommonJS/AMD的模块定义环境中使用,也能直接在页面下通过script标签引用。

浏览器环境

直接通过script标签引用,你可以获得一个全局的etpl变量

<script src="etpl.js"></script>

在AMD环境的模块定义时,你可以通过同步require获得ETpl模块

define(function (require) {
    var etpl = require('etpl');
});

在AMD环境,你也可以通过异步require获得ETpl模块

require([ 'etpl' ], function (etpl) {
});

在AMD环境下,请确保你的require.config配置能够让Loader找到ETpl模块

Node.JS环境

你可以通过npm来安装ETpl

$ npm install etpl

安装完成后,你就可以通过require获得一个ETpl模块,正常地使用它

var etpl = require('etpl');

使用

使用ETPL模块,对模板源代码进行编译,会能得到编译后的function

var render = etpl.compile('Hello ${name}!');

执行这个function,传入数据对象,就能得到模板执行的结果了

var text = render({ name: 'etpl' });

查看更多例子,或者对模板渲染结果有疑虑,就去ETPL的example看看吧。

Documents

通过文档,你可以更详细地了解ETpl的语法格式、使用方法、API等内容。

Related

Compatibility

ETpl3的新语法

我们认为,当前流行的通过block来表达模板继承中的变化,是更好的表达方式。所以在ETpl3中,我们优化了母版的语法,删除了mastercontentplacehodercontent标签,引入了block标签。

对于ETpl2的使用者,我们提供一个etpl2to3工具,能够帮助你平滑地将ETpl2的模板翻译成ETpl3。

get

ETpl2中,为了前向兼容,Engine的get方法可以根据target名称获取模板内容。

ETpl3不再支持该方法,所有的模板都通过render来使用:

  • 直接使用engine实例的render方法
  • 调用renderer function

如果仍需要该功能,说明你正在维护一个遗留系统,并且没有很频繁的升级需求。请继续使用ETpl2。

merge

ETpl的前身是ER框架自带的简易模板引擎,其基本与前身保持兼容。但出于代码体积和使用频度的考虑,ETpl删除了mergeAPI。如果想要该API,请在自己的应用中加入如下代码:

/**
 * 执行模板渲染,并将渲染后的字符串作为innerHTML填充到HTML元素中。
 * 兼容老版本的模板引擎api
 * 
 * @param {HTMLElement} element 渲染字符串填充的HTML元素
 * @param {string} name target名称
 * @param {Object=} data 模板数据
 */
etpl.merge = function ( element, name, data ) {
    if ( element ) {
        element.innerHTML = this.render( name, data );
    }
};