index.html

<!doctype html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://unpkg.com/jquery.terminal@2.x.x/js/jquery.terminal.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/jquery.terminal@2.x.x/css/jquery.terminal.min.css"/>

<script src="https://cdn.jsdelivr.net/pyodide/v0.23.3/full/pyodide.js"></script>
</head>
<style>

body {
        background-color: black;
      }
</style>
<body>
    <script>


    async function main() {


        term = $("body").terminal({
          dockerfile_generator: async function(config, ...args) {

            let pyodide = await pyodideReadyPromise;    
            output = pyodide.runPython(
                `dockerfile_generator.main.rendered_Dockerfile(config="${config}", params=["${args.join('", "')}"])`
                )
            this.echo(output)
          },
        },
        {
          processArguments : false,
          checkArity: false,
          greetings: 'Dockerfile generator (via jQuery Terminal https://terminal.jcubic.pl/ and Pyodide https://pyodide.org). '
        });
        window.term = term;

        term.ready = Promise.resolve();


        async function getPyodide() {
            let pyodide = await loadPyodide();
            
            await pyodide.loadPackage("micropip");
            const micropip = pyodide.pyimport("micropip");
            await micropip.install("dockerfile_generator");

            pyodide.runPython('import dockerfile_generator.main')

            return pyodide;
        }
        let pyodideReadyPromise = getPyodide();


      }
      window.console_ready = main();
    </script>
</html>