able-baker/run-serve.tsx

import * as MIME from "https://deno.land/std@0.180.0/media_types/mod.ts";
import * as HTTP from "https://deno.land/std@0.177.0/http/server.ts";
import * as SWCW from "https://esm.sh/@swc/wasm-web@1.3.62";

type DenoConfig = {imports:Record<string, string>};
const ImportMap:DenoConfig = {imports:{}};
const ImportMapReload =async()=>
{
    let json:DenoConfig;
    const path = Configuration.Proxy+"/deno.json";
    try
    {
        const resp = await fetch(path);
        json = await resp.json();
        if(!json?.imports)
        { throw new Error("imports not specified in deno.json") }
    }
    catch(e)
    {
        console.log(`error reading deno config "${path}" message:"${e}"`);
        return;
    }

    Object.entries(json.imports).forEach(([key, value])=>
    {
        if(value.startsWith("./"))
        {
            json.imports[key] = value.substring(1);
        }
    });

    const mapKey = (Configuration.Spoof.startsWith("/") ? Configuration.Spoof.substring(1) : Configuration.Spoof)+"/";
    if(!json.imports[mapKey])
    {
        console.log(`"${mapKey}" specifier not defined in import map`);
    }
    json.imports[mapKey] = Configuration.Spoof+"/";

    if(!json.imports["react"])
    {
        console.log(`"react" specifier not defined in import map`);
    }

    ImportMap.imports = Configuration.Remap(json.imports, Configuration);
    console.log(ImportMap.imports);
};

type CustomHTTPHandler = (inReq:Request, inURL:URL, inExt:string|false, inMap:{imports:Record<string, string>}, inConfig:Configuration)=>void|false|Response|Promise<Response|void|false>;
type CustomRemapper = (inImports:Record<string, string>, inConfig:Configuration)=>Record<string, string>;
type Configuration = {Proxy:string, Spoof:string, Allow:string, Reset:string, SWCOp:SWCW.Options, Serve:CustomHTTPHandler, Shell:CustomHTTPHandler, Remap:CustomRemapper};
type ConfigurationArgs = {Proxy?:string, Spoof?:string, Allow?:string, Reset?:string, SWCOp?:SWCW.Options, Serve?:CustomHTTPHandler, Shell?:CustomHTTPHandler, Remap?:CustomRemapper};
let Configuration:Configuration =
{
    Proxy: new URL(`file://${Deno.cwd().replaceAll("\\", "/")}`).toString(),
    Allow: "*",
    Reset: "/clear-cache",
    Spoof: "/@able",
    Serve(inReq, inURL, inExt, inMap, inConfig){},
    Remap: (inImports, inConfig)=>
    {
        const reactURL = inImports["react"];
        const setting = Configuration.SWCOp?.jsc?.transform?.react;
        if(setting && reactURL)
        {
            setting.importSource = reactURL;
        }
        return inImports;
    },
    Shell(inReq, inURL, inExt, inMap, inConfig)
    {
        const parts = Deno.mainModule.split(inConfig.Proxy);

        return new Response(
            `<!doctype html>
            <html>
                <head>
                    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
                    <meta charset="utf-8"/>
                </head>
                <body>
                    <div id="app"></div>
                    <script type="importmap">${JSON.stringify(inMap)}</script>
                    <script type="module">
                        import Mount from "${inConfig.Spoof}/boot-browser.tsx";
                        Mount("#app", "${parts[1]??"/app.tsx"}");
                    </script>
                </body>
            </html>`, {status:200, headers:{"content-type":"text/html"}});
    },
    SWCOp:
    {
        sourceMaps: false,
        minify: true,
        jsc:
        {
            target:"es2022",
            minify:
            {
                compress: { unused: true },
                mangle: true
            },
            parser:
            {
                syntax: "typescript",
                tsx: true,
            },
            transform:
            {
                react: { runtime: "automatic" }
            }
        }
    }
};

export const Transpile =
{
    Cache: new Map() as Map<string, string>,
    Files: ["tsx", "jsx", "ts", "js", "mjs"],
    Check(inExtension:string|false)
    {
        return inExtension ? this.Files.includes(inExtension) : false;
    },
    Clear()
    {
        const size = this.Cache.size;
        this.Cache.clear();
        ImportMapReload();
        return size;
    },
    Fetch: async function(inPath:string, inKey:string, inCheckCache=true)
    {
        const check = this.Cache.get(inPath);
        if(check && inCheckCache)
        {
            return check;
        }
        else
        {
            try
            {
                const resp = await fetch(inPath);
                const text = await resp.text();
                const {code} = await SWCW.transform(text, { ...Configuration.SWCOp, filename:inKey});
                this.Cache.set(inKey, code);
                return code;
            }
            catch(e)
            {
                console.log(`Transpile.Fetch error. Key:"${inKey}" Path:"${inPath}" Error:"${e}"`);
                return null;
            }
        }
    }
};

export const Extension =(inPath:string)=>
{
    const posSlash = inPath.lastIndexOf("/");
    const posDot = inPath.lastIndexOf(".");
    return posDot > posSlash ? inPath.substring(posDot+1).toLowerCase() : false;
};

export const Configure =(config:ConfigurationArgs)=>
{
    Configuration = {...Configuration, ...config};
    ImportMapReload();
}

await ImportMapReload();
await SWCW.default();
HTTP.serve(async(req: Request)=>
{
    const url:URL = new URL(req.url);
    const ext = Extension(url.pathname);
    const headers = {"content-type":"application/json", "Access-Control-Allow-Origin": Configuration.Allow, "charset":"UTF-8"};

    // cache-reset route
    if(url.pathname === Configuration.Reset)
    {
        return new Response(`{"cleared":${Transpile.Clear()}}`, {headers});
    }

    // allow for custom handler
    const custom = await Configuration.Serve(req, url, ext, ImportMap, Configuration);
    if(custom)
    {
        return custom;
    }

    // transpileable files
    if(Transpile.Check(ext))
    {
        let code;
        let path;
        if(url.pathname.startsWith(Configuration.Spoof+"/"))
        {
            const clipRoot = import.meta.url.substring(0, import.meta.url.lastIndexOf("/"));
            const clipPath = url.pathname.substring(url.pathname.indexOf("/", 1));
            if(clipPath.startsWith("/boot-"))
            {
                path = clipRoot+"/boot-browser.tsx";
            }
            else
            {
                path = clipRoot + clipPath;
            }
            code = await Transpile.Fetch(path, url.pathname, true);
        }
        else
        {
            path = Configuration.Proxy + url.pathname;
            code = await Transpile.Fetch(path, url.pathname);    
        }

        if(code)
        {
            return new Response(code, {headers:{...headers, "content-type":"application/javascript"}} );     
        } 
    }

    // custom page html
    if(!ext)
    {
        const shell = await Configuration.Shell(req, url, ext, ImportMap, Configuration);
        if(shell)
        {
            return shell;
        }
    }

    // all other static files
    if(ext)
    {
        try
        {
            const type = MIME.typeByExtension(ext);
            const file = await fetch(Configuration.Proxy + url.pathname);
            const text = await file.text();
            return new Response(text, {headers:{...headers, "content-type":type||""}});
        }
        catch(e)
        {
            return new Response(`{"error":"${e}", "path":"${url.pathname}"}`, {status:404, headers});
        }
    }

    return new Response(`{"error":"unmatched route", "path":"${url.pathname}"}`, {status:404, headers});

});
init 2023-06-06 12:50:50 -04:00			`import * as MIME from "https://deno.land/std@0.180.0/media_types/mod.ts";`
			`import * as HTTP from "https://deno.land/std@0.177.0/http/server.ts";`
local started 2023-06-06 22:24:43 -04:00			`import * as SWCW from "https://esm.sh/@swc/wasm-web@1.3.62";`
init 2023-06-06 12:50:50 -04:00
misc fixes 2023-06-07 23:35:00 -04:00			`type DenoConfig = {imports:Record<string, string>};`
			`const ImportMap:DenoConfig = {imports:{}};`
more configuration 2023-06-07 14:15:57 -04:00			`const ImportMapReload =async()=>`
			`{`
misc fixes 2023-06-07 23:35:00 -04:00			`let json:DenoConfig;`
			`const path = Configuration.Proxy+"/deno.json";`
more configuration 2023-06-07 14:15:57 -04:00			`try`
			`{`
misc fixes 2023-06-07 23:35:00 -04:00			`const resp = await fetch(path);`
			`json = await resp.json();`
			`if(!json?.imports)`
			`{ throw new Error("imports not specified in deno.json") }`
more configuration 2023-06-07 14:15:57 -04:00			`}`
			`catch(e)`
			`{`
misc fixes 2023-06-07 23:35:00 -04:00			console.log(`error reading deno config "${path}" message:"${e}"`);
			`return;`
more configuration 2023-06-07 14:15:57 -04:00			`}`
remap imports 2023-06-20 22:56:20 -04:00
			`Object.entries(json.imports).forEach(([key, value])=>`
			`{`
			`if(value.startsWith("./"))`
			`{`
			`json.imports[key] = value.substring(1);`
			`}`
			`});`
configurable lib folder 2023-06-21 22:35:59 -04:00
			`const mapKey = (Configuration.Spoof.startsWith("/") ? Configuration.Spoof.substring(1) : Configuration.Spoof)+"/";`
			`if(!json.imports[mapKey])`
remap imports 2023-06-20 22:56:20 -04:00			`{`
configurable lib folder 2023-06-21 22:35:59 -04:00			console.log(`"${mapKey}" specifier not defined in import map`);
remap imports 2023-06-20 22:56:20 -04:00			`}`
configurable lib folder 2023-06-21 22:35:59 -04:00			`json.imports[mapKey] = Configuration.Spoof+"/";`
remap imports 2023-06-20 22:56:20 -04:00
			`if(!json.imports["react"])`
			`{`
			console.log(`"react" specifier not defined in import map`);
			`}`

pass config though handlers 2023-06-21 21:20:24 -04:00			`ImportMap.imports = Configuration.Remap(json.imports, Configuration);`
remap imports 2023-06-20 22:56:20 -04:00			`console.log(ImportMap.imports);`
more configuration 2023-06-07 14:15:57 -04:00			`};`

pass config though handlers 2023-06-21 21:20:24 -04:00			`type CustomHTTPHandler = (inReq:Request, inURL:URL, inExt:string\|false, inMap:{imports:Record<string, string>}, inConfig:Configuration)=>void\|false\|Response\|Promise<Response\|void\|false>;`
			`type CustomRemapper = (inImports:Record<string, string>, inConfig:Configuration)=>Record<string, string>;`
configurable lib folder 2023-06-21 22:35:59 -04:00			`type Configuration = {Proxy:string, Spoof:string, Allow:string, Reset:string, SWCOp:SWCW.Options, Serve:CustomHTTPHandler, Shell:CustomHTTPHandler, Remap:CustomRemapper};`
			`type ConfigurationArgs = {Proxy?:string, Spoof?:string, Allow?:string, Reset?:string, SWCOp?:SWCW.Options, Serve?:CustomHTTPHandler, Shell?:CustomHTTPHandler, Remap?:CustomRemapper};`
add Shell phase 2023-06-07 17:09:40 -04:00			`let Configuration:Configuration =`
init 2023-06-06 12:50:50 -04:00			`{`
got it! 2023-06-20 21:40:49 -04:00			Proxy: new URL(`file://${Deno.cwd().replaceAll("\\", "/")}`).toString(),
init 2023-06-06 12:50:50 -04:00			`Allow: "*",`
client started 2023-06-06 17:22:14 -04:00			`Reset: "/clear-cache",`
configurable lib folder 2023-06-21 22:35:59 -04:00			`Spoof: "/@able",`
cleanup console logs 2023-06-21 21:31:21 -04:00			`Serve(inReq, inURL, inExt, inMap, inConfig){},`
pass config though handlers 2023-06-21 21:20:24 -04:00			`Remap: (inImports, inConfig)=>`
more configuration 2023-06-07 14:15:57 -04:00			`{`
remap imports 2023-06-20 22:56:20 -04:00			`const reactURL = inImports["react"];`
misc fixes 2023-06-07 23:35:00 -04:00			`const setting = Configuration.SWCOp?.jsc?.transform?.react;`
remap imports 2023-06-20 22:56:20 -04:00			`if(setting && reactURL)`
misc fixes 2023-06-07 23:35:00 -04:00			`{`
			`setting.importSource = reactURL;`
			`}`
more configuration 2023-06-07 14:15:57 -04:00			`return inImports;`
			`},`
pass config though handlers 2023-06-21 21:20:24 -04:00			`Shell(inReq, inURL, inExt, inMap, inConfig)`
add Shell phase 2023-06-07 17:09:40 -04:00			`{`
pass config though handlers 2023-06-21 21:20:24 -04:00			`const parts = Deno.mainModule.split(inConfig.Proxy);`
got it! 2023-06-20 21:40:49 -04:00
add Shell phase 2023-06-07 17:09:40 -04:00			`return new Response(`
			`<!doctype html>
			`<html>`
			`<head>`
prefixing 2023-06-21 17:21:36 -04:00			`<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">`
			`<meta charset="utf-8"/>`
add Shell phase 2023-06-07 17:09:40 -04:00			`</head>`
			`<body>`
			`<div id="app"></div>`
			`<script type="importmap">${JSON.stringify(inMap)}</script>`
			`<script type="module">`
configurable lib folder 2023-06-21 22:35:59 -04:00			`import Mount from "${inConfig.Spoof}/boot-browser.tsx";`
got it! 2023-06-20 21:40:49 -04:00			`Mount("#app", "${parts[1]??"/app.tsx"}");`
add Shell phase 2023-06-07 17:09:40 -04:00			`</script>`
			`</body>`
			</html>`, {status:200, headers:{"content-type":"text/html"}});
			`},`
more configuration 2023-06-07 11:22:49 -04:00			`SWCOp:`
local started 2023-06-06 22:24:43 -04:00			`{`
			`sourceMaps: false,`
			`minify: true,`
			`jsc:`
			`{`
mount added 2023-06-20 09:50:14 -04:00			`target:"es2022",`
local started 2023-06-06 22:24:43 -04:00			`minify:`
			`{`
			`compress: { unused: true },`
			`mangle: true`
			`},`
			`parser:`
			`{`
			`syntax: "typescript",`
			`tsx: true,`
			`},`
			`transform:`
			`{`
			`react: { runtime: "automatic" }`
			`}`
more configuration 2023-06-07 11:22:49 -04:00			`}`
			`}`
			`};`

			`export const Transpile =`
			`{`
local started 2023-06-06 22:24:43 -04:00			`Cache: new Map() as Map<string, string>,`
more configuration 2023-06-07 11:22:49 -04:00			`Files: ["tsx", "jsx", "ts", "js", "mjs"],`
			`Check(inExtension:string\|false)`
			`{`
			`return inExtension ? this.Files.includes(inExtension) : false;`
			`},`
local started 2023-06-06 22:24:43 -04:00			`Clear()`
			`{`
			`const size = this.Cache.size;`
			`this.Cache.clear();`
more configuration 2023-06-07 14:15:57 -04:00			`ImportMapReload();`
local started 2023-06-06 22:24:43 -04:00			`return size;`
			`},`
			`Fetch: async function(inPath:string, inKey:string, inCheckCache=true)`
			`{`
more configuration 2023-06-07 11:22:49 -04:00			`const check = this.Cache.get(inPath);`
			`if(check && inCheckCache)`
local started 2023-06-06 22:24:43 -04:00			`{`
more configuration 2023-06-07 11:22:49 -04:00			`return check;`
			`}`
			`else`
			`{`
			`try`
local started 2023-06-06 22:24:43 -04:00			`{`
more configuration 2023-06-07 11:22:49 -04:00			`const resp = await fetch(inPath);`
			`const text = await resp.text();`
add Shell phase 2023-06-07 17:09:40 -04:00			`const {code} = await SWCW.transform(text, { ...Configuration.SWCOp, filename:inKey});`
more configuration 2023-06-07 11:22:49 -04:00			`this.Cache.set(inKey, code);`
			`return code;`
local started 2023-06-06 22:24:43 -04:00			`}`
more configuration 2023-06-07 11:22:49 -04:00			`catch(e)`
local started 2023-06-06 22:24:43 -04:00			`{`
misc fixes 2023-06-07 23:35:00 -04:00			console.log(`Transpile.Fetch error. Key:"${inKey}" Path:"${inPath}" Error:"${e}"`);
more configuration 2023-06-07 11:22:49 -04:00			`return null;`
local started 2023-06-06 22:24:43 -04:00			`}`
			`}`
			`}`
			`};`
init 2023-06-06 12:50:50 -04:00
more configuration 2023-06-07 11:22:49 -04:00			`export const Extension =(inPath:string)=>`
			`{`
			`const posSlash = inPath.lastIndexOf("/");`
			`const posDot = inPath.lastIndexOf(".");`
			`return posDot > posSlash ? inPath.substring(posDot+1).toLowerCase() : false;`
			`};`

started 2023-06-15 17:13:51 -04:00			`export const Configure =(config:ConfigurationArgs)=>`
			`{`
			`Configuration = {...Configuration, ...config};`
			`ImportMapReload();`
			`}`
more configuration 2023-06-07 14:15:57 -04:00
			`await ImportMapReload();`
			`await SWCW.default();`
init 2023-06-06 12:50:50 -04:00			`HTTP.serve(async(req: Request)=>`
			`{`
			`const url:URL = new URL(req.url);`
more configuration 2023-06-07 11:22:49 -04:00			`const ext = Extension(url.pathname);`
add Shell phase 2023-06-07 17:09:40 -04:00			`const headers = {"content-type":"application/json", "Access-Control-Allow-Origin": Configuration.Allow, "charset":"UTF-8"};`
more configuration 2023-06-07 11:22:49 -04:00
			`// cache-reset route`
add Shell phase 2023-06-07 17:09:40 -04:00			`if(url.pathname === Configuration.Reset)`
init 2023-06-06 12:50:50 -04:00			`{`
more configuration 2023-06-07 11:22:49 -04:00			return new Response(`{"cleared":${Transpile.Clear()}}`, {headers});
init 2023-06-06 12:50:50 -04:00			`}`

more configuration 2023-06-07 14:15:57 -04:00			`// allow for custom handler`
pass config though handlers 2023-06-21 21:20:24 -04:00			`const custom = await Configuration.Serve(req, url, ext, ImportMap, Configuration);`
more configuration 2023-06-07 14:15:57 -04:00			`if(custom)`
			`{`
			`return custom;`
			`}`

more configuration 2023-06-07 11:22:49 -04:00			`// transpileable files`
			`if(Transpile.Check(ext))`
init 2023-06-06 12:50:50 -04:00			`{`
got it! 2023-06-20 21:40:49 -04:00			`let code;`
			`let path;`
configurable lib folder 2023-06-21 22:35:59 -04:00			`if(url.pathname.startsWith(Configuration.Spoof+"/"))`
make _lib_ accessable 2023-06-08 16:59:56 -04:00			`{`
flatten 2023-06-21 17:32:10 -04:00			`const clipRoot = import.meta.url.substring(0, import.meta.url.lastIndexOf("/"));`
			`const clipPath = url.pathname.substring(url.pathname.indexOf("/", 1));`
			`if(clipPath.startsWith("/boot-"))`
got it! 2023-06-20 21:40:49 -04:00			`{`
flatten 2023-06-21 17:32:10 -04:00			`path = clipRoot+"/boot-browser.tsx";`
got it! 2023-06-20 21:40:49 -04:00			`}`
			`else`
make _lib_ accessable 2023-06-08 16:59:56 -04:00			`{`
flatten 2023-06-21 17:32:10 -04:00			`path = clipRoot + clipPath;`
make _lib_ accessable 2023-06-08 16:59:56 -04:00			`}`
got it! 2023-06-20 21:40:49 -04:00			`code = await Transpile.Fetch(path, url.pathname, true);`
make _lib_ accessable 2023-06-08 16:59:56 -04:00			`}`
			`else`
			`{`
got it! 2023-06-20 21:40:49 -04:00			`path = Configuration.Proxy + url.pathname;`
			`code = await Transpile.Fetch(path, url.pathname);`
make _lib_ accessable 2023-06-08 16:59:56 -04:00			`}`
got it! 2023-06-20 21:40:49 -04:00
			`if(code)`
			`{`
			`return new Response(code, {headers:{...headers, "content-type":"application/javascript"}} );`
			`}`
init 2023-06-06 12:50:50 -04:00			`}`
more configuration 2023-06-07 11:22:49 -04:00
hmr roughed in (you have to clear-cache?) 2023-06-08 23:19:03 -04:00			`// custom page html`
			`if(!ext)`
			`{`
pass config though handlers 2023-06-21 21:20:24 -04:00			`const shell = await Configuration.Shell(req, url, ext, ImportMap, Configuration);`
hmr roughed in (you have to clear-cache?) 2023-06-08 23:19:03 -04:00			`if(shell)`
			`{`
			`return shell;`
			`}`
			`}`

more configuration 2023-06-07 11:22:49 -04:00			`// all other static files`
more configuration 2023-06-07 14:15:57 -04:00			`if(ext)`
init 2023-06-06 12:50:50 -04:00			`{`
more configuration 2023-06-07 14:15:57 -04:00			`try`
			`{`
			`const type = MIME.typeByExtension(ext);`
add Shell phase 2023-06-07 17:09:40 -04:00			`const file = await fetch(Configuration.Proxy + url.pathname);`
more configuration 2023-06-07 14:15:57 -04:00			`const text = await file.text();`
			`return new Response(text, {headers:{...headers, "content-type":type\|\|""}});`
			`}`
			`catch(e)`
			`{`
			return new Response(`{"error":"${e}", "path":"${url.pathname}"}`, {status:404, headers});
			`}`
init 2023-06-06 12:50:50 -04:00			`}`
more configuration 2023-06-07 11:22:49 -04:00
more configuration 2023-06-07 14:15:57 -04:00			return new Response(`{"error":"unmatched route", "path":"${url.pathname}"}`, {status:404, headers});

init 2023-06-06 12:50:50 -04:00			`});`