JSFiddle - React, Tailwind, and code Playground

by magikMaker

HTML

<script type="text/tmpl" id="the-template">
    <%= title %>
    <% for(var i = 0, l = items.length; i < l; ++i){ %>
        - <%= items[i].name %> -
    <% } %>
</script>

JavaScript

var inner = function(obj){
    var p = [], 
    print = function () {
        p.push.apply(p, arguments);
    };
    
    with (obj) {
        p.push('     ', title, '     ');
        for (var i = 0, l = items.length; i < l; ++i) {
            p.push('         - ', items[i].name, ' -     ');
        }
        p.push(' ');
    }
    
    return p.join('');
};

(function () {
    var cache = {};

    inspectString = function inspectString(str, data) {
    var html = document.getElementById(str).innerHTML;
        console.log(html);
        
        h = '';
        h += "var p=[],print=function(){p.push.apply(p,arguments);};";
        h += "with(obj){p.push('";
        h += html
        .replace(/[\r\t\n]/g, " ")
        .split("<%").join("\t")
        .replace(/((^|%>)[^\t]*)'/g, "$1\r")
        .replace(/\t=(.*?)%>/g, "',$1,'")
        .split("\t").join("');")
        .split("%>").join("p.push('")
        .split("\r").join("\\'")
        h += "');}return p.join('');";
        
        console.log(' -------------------------------------- ');
        console.log(h);
        
/*
    var fn = !/\s/.test(str) ?
        cache[str] = cache[str] ||
            magikTemplate(document.getElementById(str).innerHTML) :

      //
      // Generate a reusable function that will serve as a template
      // generator (and which will be cached).
      //
        new Function("obj",
            "var p=[],print=function(){p.push.apply(p,arguments);};" +

              // Introduce the data as local variables using with
                "with(obj){p.push('" +

              // Convert the template into pure JavaScript
                str
                    .replace(/[\r\t\n]/g, " ")
                    .split("<%").join("\t")
                    .replace(/((^|%>)[^\t]*)'/g, "$1\r")
                    .replace(/\t=(.*?)%>/g, "',$1,'")
                    .split("\t").join("');")
                    .split("%>").join("p.push('")
                    .split("\r").join("\\'")
          ...