Repository files navigation

English |简体中文

A javascript template engine that is simple, easy to use, and supports webpack, rspack, vite, esbuild, rollup, parcel, browserify, fis, and gulp.

• Native JS syntax, template parsing, compilation, and rendering
• Supports all browsers and Node, supports TypeScript
• Precompilation supports mainstream packaging tools
• Custom configurations, decorators, and functions
• Data filtering support
• Exception capture functionality
• Subtemplates
• Sandbox mode
• Supports JIT and AOT compilation modes
• Provides CLI integrated tools
• Provides support for editor plugins

template.js is a better way than concatenating strings, Click to usecodesandbox for a quick demo

Template example

<ul>    <%for(var i = 0; i < list.length; i++) {%>        <li><%:=list[i].name%></li>    <%}%></ul>

Data example

constdata={list:[{name:'yan'},{name:'haijing'}],};

Render output

<ul><li>yan</li><li>haijing</li></ul>

Editor plugins supported by template.js

Quickly initialize a project using CLI tools

$ npx @templatejs/cli new myapp# Choose the corresponding platform# ❯ webpack#   rspack#   vite#   rollup#   esbuild#   parcel2#   parcel1#   fis3#   browserify#   gulp#   browser

If you already have a project, you can choose a corresponding plugin, template.js supports different usage methods

Other packages summary

• @templatejs/runtime The template.js runtime, providing runtime support for the rendering function generated by precompiler.
• @templatejs/parser The template.js template parser.
• template-vscode The template.js vscode plugin.

This project uses lerna to manage multiple plugins. Common lerna commands are as follows, note that the npx prefix cannot be left out:

$ npx lerna init# Initialize$ npx lerna create @templatejs/parser# Create a package$ npx lerna add yargs --scope=@templatejs/parser# Install package dependencies$ npx lerna list# List all packages$ npx lerna bootstrap# Install all dependencies$ npx lerna link# Create all soft links$ npx lerna changed# List the packages to be updated next time when using lerna publish$ npx lerna publish# Will tag, upload git, upload npm

Release steps, modify changelog

$ yarn lint$ yarn build$ yarntest$ npx lerna publish

Release without tagging, suitable for test package.

$ yarn lint$ yarn build$ yarntest$ lerna version --no-git-tag-version$ npx lerna publish from-package --dist-tag next

contributors

CHANGELOG.md

TODO.md

• Baidu Zhidao
• Baidu Jingyan
• Baidu Shifu
• Meituan Waimai
• Yuanfudao
• 58 Financial
• Unisplendour
• Uxin

To learn about who is using this,click here.

• BaiduTemplate
• artTemplate
• Juicer
• handlebarsjs
• PUG(Originally Jade)
• EJS
• Only 20 lines of Javascript code! A step-by-step guide to creating a webpage template engine