var-in-html

Var-in-html is a package for variables and templates use in HTML It parses variables and templates by a commit preprocessor. It could be use as a cli tool or a package for your building script.

Usage no npm install needed!

<script type="module">
  import varInHtml from 'https://cdn.skypack.dev/var-in-html';
</script>

README

Var-in-html

Var-in-html is a command line tool for use variable in HTML. It implements templates and variables with HTML comment.

Install

>[sudo] npm install -g var-in-html

Usage

>var-in-html

Varible

Evaluation of variables always before file content. It's demanded.

Evaluation: <!--${greeting} "Hi!"-->

Using in content:

<!--${greeting}--> How are you?             --> Ok!(Hi! How are you?)
<!-- ${greeting}    -->                     --> Ok!(Hi!)
<!--${greeting }-->                         --> Wrong!(no parse)

Template

Template is a useful feature.

Example

Current directory is web/. All html files in it's source/ directory(Not scripts/css files). And source/ has child directory templates/. After compiled, HTML file in source/ will be copyed into current directory(web/, become brothers of source/).

file source/file1.html

<!--TEMPLATE temp1-->
<!--${title} file1-->
<h1>This is file1</h1>

file source/tempaltes/temp1.html

<html>
<head><title><!--${title}--></title></head>
<body style="background:green;"><!--MAIN--></body>
</html>

In console:

web> ls -- There are one directory source/
web> node engine.js
web> ls -- There should has source/, file1.html

So, after processed by viewEngine, generated file1.html in web/ . file1.html looks like:

<html>
<head><title>file1</title></head>
<body style="background:green;"><h1>This is file1</h1></body>
</html>

Notice: js/css files should NOT be in source/ , They should be in web/ .

About