Git Product home page Git Product logo

velocity.js's Introduction

Velocity - Template Engine

NPM version build status Test coverage npm download

Velocityjs is velocity template engine for javascript.

中文版文档

Features

  • Supports both client and server side use.
  • Separation of parsing and rendering templates.
  • The basic syntax is fully supported all java version velocity.
  • Vim Syntax for vim.

Install

via npm:

$ npm install velocityjs

Broswer

Compatible all modern broswer, You can try test case on your browser to test it.

For other lower version broswer, you need have those polyfill function.

  1. Array.prototype map, forEach, some, filter, every, indexOf
  2. Date.now
  3. Object.keys

Examples

You can find a lot of examples from the tests directory. There is no different between the use of browser and NodeJs.

Public API

{
  // render method
  render(vm: string, context?: Object, macros?: Object): string;

  parse(vm: string, config?: Object, ignorespace?: boolean): Array<Ast>;

  Compile: {
    (asts: Array<Ast>, config?: Object): {
      render(context?: Object, macros?: Object);
    };
  };
}

render

params:

  • vm {string} velocity string input
  • context {object} render context, data or function for vm
  • macros {object} such as #include('path/xxx') , you can define you inlcude macro function
var Velocity = require('velocityjs');

Velocity.render('string of velocity', context, macros);

context

context is an object or undefined, for vm $foo.bar, data look up path will be context.foo.bar. context can have method, and call it just on velocity string.

The method of context, will have eval method on this of inner method body. You can eval to rerender velocity string, such as test code $control.setTemplate.

Compile and parse

parse method can parse vm, and return ast tree of velocity.

Compile will render asts to result string.

var Compile = Velocity.Compile;

var asts = Velocity.parse('string of velocity');
(new Compile(asts)).render(context, macros);

Compile

params:

  • asts {array} array of vm asts tree
  • config {object} you can define some option for Compile
config
  • escape {boolean} default true, default escape variable to html encode, you can set false to close it.
  • unescape {object} define the object, which key do not need escape. For example, set unescape equal {control: true}, so $control.html will not escape.
  • env {string} when env equal development will throw error when null values are used

parse

params:

  • vm {string} string to parse
  • blocks {object} self define blocks, such as #cms(1) hello #end, you can set {cms: true}
  • ignorespace {boolean} if set true, then ignore the newline trim.

Syntax

Syntax you can find from velocity user guide

Directives

Directives supports have set, foreach, if|else|elseif, macro, break, stop.

Some othe directive evaluate, define, parse, do not supported default, but You can realize by context or macros, for example parse

Questions

You can find help from those ways:

  1. New issue
  2. Email to eward.song at gmail.com
  3. 阿里内部员工,可以通过 hanwen.sah 搜到我的旺旺

Other

Recommend an other velocity.

License

(The MIT License)

velocity.js's People

Contributors

shepherdwind avatar 2betop avatar jamescookie avatar rschick avatar toqoz avatar cabumtz avatar davishong avatar popomore avatar xch89820 avatar edwardzzz avatar

Watchers

James Cloos avatar lenzhao avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.