Penggunaan bahasa templat EJS
tmt-workflow menyokong enjin corak EJS, yang boleh menjimatkan banyak kerja dalam proses menulis HTML, dan mengurangkan bilangan baris kod dan meningkatkan kecekapan kod melalui ciri seperti include
、for 循环
等特性减少代码行数,提高代码的可读性。
我们采用 EJS 2.0 以上版本:https://github.com/mde/ejs
EJS 特性
输出
在页面中输出变量值,你可以这么用: <div><%= var01 %></div>
include dan
Kami menggunakan EJS 2.0 ke atas: https://github.com/mde/ejs🎜
🎜🎜Jika anda tidak mahu kandungan nilai pembolehubah dilepaskan, gunakan ini: 🎜<div><%- var02 %></div> templat semasa, kerana templat akan disusun ke dalam fungsi Javascript. Ciri EJS
Output
🎜Untuk mengeluarkan nilai pembolehubah pada halaman, anda boleh menggunakan ini: 🎜<div><%= var01 %></div>
<% var name = "littledu" %> <div>
Hello, My Name is <%-name %> </div>
LoopSama seperti menulis Javascript<ul> <% for(var i = 0; i < 10; i++) {%> <li>我是列表 <%-i %></li> <% } %> <ul>Sertakan boleh merujuk fail templat dengan laluan relatif, seperti
html/html _block/head.htmlDua fail ini, anda boleh menggunakan <% termasuk _block/head.html %>
dalam index.html. <ul>
<% users.forEach(function(user){ %>
<% include user/show %>
<% }) %>
</ul>
html/index.html
和 html/_block/head.html
这两个文件,你就可以在 index.html 这么用 <% include _block/head.html %>
TmT EJS Helper
Selain EJS, kami menyediakan beberapa fungsi templat tambahan untuk memudahkan beberapa kerja kami.
GIT: https://github.com/willerce/tmt-ejs-helper
css()
Rujuk fail CSS dengan cepat dan lampirkan laluan mutlak CSS pada baris ulasan untuk kegunaan mudah oleh bahagian hadapan hiliran . . , dan className
<head>
<title>页面标题</title>
<%- css("style-workflow.css") %>
</head>
Selepas penyusunan:
text() Teks pemegang tempat
Jana imej pemegang tempat dengan panjang yang ditentukan Parameter kedua ialah nombor perkataan mengimbangi
Sebagai contoh, fungsi berikut mungkin menghasilkan teks panjang 7 ~ 13 bit. Disusun:
<img src="http://temp.im/200x400" class="block__img"/>
Lebih banyak fungsi templat? Menunggu anda untuk mengambilnya~