JavaScript | HTML Preprocessor

Hello, dear friends!

One wonderful day at one wonderful hour there was an urgent need for JS | HTML preprocessor and, as usual, the search for a ready-made solution was not crowned with success, something was missing everywhere (there were no global variables, string insertion, string replacement, import, etc.) ). Well, since I am a severe Yakut guy, there was only one way out - to do everything myself. Well? Well, the result of my work, I decided to put on the opinion of the community.

Introduction

The preprocessor is designed for js (json) and html (xhtml) files, these files must be with the appropriate extensions. The preprocessor supports the following range of functions:

• Insertion by condition and without (multi-line support)
• Replacing string \ strings \ substrings by condition and without (replacing part of string / strings is supported (yes, one control construct can replace parts at once in a set of strings) that satisfies a regular expression)
• Global variables (defined in a separate file) and local variables defined within the file (have higher priority) are supported.
• Import file by condition and without, while css files, with appropriate settings in the control structure, are framed with the style tag

')
Comments are used to insert control structures; therefore, they do not interfere with the operation of the code prior to processing by the preprocessor.

Startup method

The preprocessor is a usual groovy script that needs one mandatory argument:

project.sourceDir - path to the initial directory in which the replacement will take place.

and you can also specify two optional

project.confFile - path to the global config file.
project.excludeDir - comma-separated folder names that do not need to be replaced (I’ll say right away that this is the folder name of the lowest level, the path to this folder is not taken into account, but minus, but I will try to finish it).

You can also use maven to run past standard tools.

Operations

Attention attributes in operations should follow a strict order (the order will be described opposite to the command below), but optional attributes (pattern, if, type) can be not used, below I will mark them? In any operation except define, the last attribute can be if = ^ condition ^, where condition is a condition, if it is written in the key = value format, then the operation will be executed if the value of a global or local variable named key matches value, otherwise the operation will be executed if there is a global or local variable named condition.

Next, I will give a complete set of operations and their use in the examples, I will not give examples with if since I described above how to use it.

The opening and closing control structures must be on different lines, the text to be inserted / replaced must be between them!

Insert (insert? If)

Examples of using:

html

<!--insert <script type="text/javascript" src="vendors/release/dojo/dojo-mini.js" ></script> <script type="text/javascript" src="vendors/release/dijit/dijit-mini.js" ></script> <script type="text/javascript" src="vendors/release/dojox/dojox-mini.js" ></script> /insert--> 

js

 /*insert var mode = 'dev' /insert*/ 

Replace (replace to? Pattern? If)

to - the string to be replaced (supports placeholders)
pattern - pattern for substring replacement

Examples

html

 <!--replace to=^<script type="text/javascript" src="vendors/release/dojox/dojox-mini.js" ></script>^--> <script type="text/javascript" src="vendors/release/dojox/dojox-mini.js" ></script> <!--/replace--> 

Replaces everything between the control comments with the value of the to attribute.

 <!--replace to=^/release/^ pattern=^/dev/^--> <link rel="stylesheet" type="text/css" href="vendors/dev/dijit/themes/tundra/tundra.css"> <link rel="stylesheet" type="text/css" href="vendors/dev/dojox/grid/resources/Grid.css"> <link rel="stylesheet" type="text/css" href="vendors/dev/dojox/image/resources/Lightbox.css"> <!--/replace--> 

Replaces all substrings matching the value of the pattern attribute with the value of the to attribute in each line between comments.

js

 window.appVersion = /*replace to=^${project.version}^*/0.6/*\replace*/; 

Replaces the line between control comments with the value of the to attribute.

 /*replace to=^dojo^ pattern=^dijit^*/ dojo.require("dijit.layout.LayoutContainer"); dojo.require("dijit.layout.ContentPane"); dojo.require("dijit.form.TextBox"); /*/replace*/ 

Replaces all substrings matching the value of the pattern attribute with the value of the to attribute in each line between comments.

Import files (import file? Type? If)

file - the path to the file, it is best to write absolute (supports placeholders)
type - file type, additional processing of the file depends on it (at the moment, the css type is supported, and the contents of the file are packaged in one line and framed with the style tag

Examples

html

 <!--import file=^path^ type=^css^--> 

js

 //import file=^path^ type=^css^ 

Local Variables (define key = value | key)

Initialization of a local variable (its scope is the current file). If only a key is specified, an empty variable will be created.
key - variable name
value - value

Examples

html

 <!--define debug=true--> <!--define env=qa--> 

js

 //define debug=true //define env=qa 

I note that local variables are initialized sequentially from top to bottom in the same file parsing run, that is, if the variable is defined in the middle of the file, then it cannot be used in the control structures above.

Global variables

The preprocessor can specify a file that contains global variables that can be used in operations.

Example of specifying a file with variables using maven (command line arguments can be used)

 <project.confPath>${pom.basedir}/configuration/qa.json</project.confPath> 

File format

key0: value0
key1: value1

Use of placeholders

window.appVersion = /*replace to=^${version}^*/0.6/*/replace*/;

The expression $ {version} will be replaced with the value of the corresponding global or local variable.

In addition, there is support for operations on variables, currently only one is implemented - removing quotes from the end and beginning of the variable value:
$ {rootPath: removeQuotes }

Conclusion

Well, in principle, and all, if anyone comes in handy, I will be glad, for the found bugs and suggestions I will be grateful.

Github

Source and test pages: github.com/iseeyou911/JSPP
The configuration file tests / qa.json. To import to index.html you need to fix
in line

 <!--define path=../tests/--> 

absolute path to this folder.