hmr #1

Merged
SethTrowbridge merged 9 commits from hmr into master 2023-04-01 11:13:22 -04:00
Showing only changes of commit 85bfaf5386 - Show all commits

View File

@ -3,10 +3,7 @@ import * as MIME from "https://deno.land/std@0.180.0/media_types/mod.ts";
import { debounce } from "https://deno.land/std@0.151.0/async/debounce.ts"; import { debounce } from "https://deno.land/std@0.151.0/async/debounce.ts";
const Transpiled = new Map(); const Transpiled = new Map();
/** const Transpileable =(inFilePath:string):boolean=>
* checks for (.tsx | .jsx | .ts | .js) extensions
*/
export const Transpileable =(inFilePath:string):boolean=>
{ {
let dotIndex = inFilePath.length-4; let dotIndex = inFilePath.length-4;
if(inFilePath[dotIndex] !== ".") if(inFilePath[dotIndex] !== ".")
@ -25,14 +22,14 @@ export const Transpileable =(inFilePath:string):boolean=>
return false; return false;
}; };
export const Transpile =async(inCode:string, inKey:string):Promise<string>=> const Transpile =async(inCode:string, inKey:string):Promise<string>=>
{ {
const transpile = await ESBuild.transform(inCode, { loader: "tsx", sourcemap: "inline", minify:true }); const transpile = await ESBuild.transform(inCode, { loader: "tsx", sourcemap: "inline", minify:true });
Transpiled.set(inKey, transpile.code); Transpiled.set(inKey, transpile.code);
return transpile.code; return transpile.code;
}; };
type Transpiler = (inPath:string, inKey:string, inCheck?:boolean)=>Promise<string>; type Transpiler = (inPath:string, inKey:string, inCheck?:boolean)=>Promise<string>;
export const TranspileFS:Transpiler =async(inPath, inKey, inCheck)=> const TranspileFS:Transpiler =async(inPath, inKey, inCheck)=>
{ {
if(inCheck) if(inCheck)
{ {
@ -45,7 +42,7 @@ export const TranspileFS:Transpiler =async(inPath, inKey, inCheck)=>
const body = await Deno.readTextFile(inPath); const body = await Deno.readTextFile(inPath);
return Transpile(body, inKey); return Transpile(body, inKey);
}; };
export const TranspileURL:Transpiler =async(inPath, inKey, inCheck)=> const TranspileURL:Transpiler =async(inPath, inKey, inCheck)=>
{ {
if(inCheck) if(inCheck)
{ {
@ -62,7 +59,7 @@ export const TranspileURL:Transpiler =async(inPath, inKey, inCheck)=>
}; };
const LibPath = "lib";
type ImportMap = {imports?:Record<string, string>, importMap?:string}; type ImportMap = {imports?:Record<string, string>, importMap?:string};
let ImportString = ``; let ImportString = ``;
let ImportObject:ImportMap = {}; let ImportObject:ImportMap = {};
@ -102,8 +99,7 @@ try
if(importReact) if(importReact)
{ {
ImportObject.imports["react-original"] = importReact; ImportObject.imports["react-original"] = importReact;
ImportObject.imports["react"] = "/lib/react.tsx"; ImportObject.imports["react"] = `./${LibPath}/react.tsx`;
ImportObject.imports["hmr"] = "/lib/hmr.tsx";
ImportString = JSON.stringify(ImportObject); ImportString = JSON.stringify(ImportObject);
} }
else else
@ -121,21 +117,16 @@ catch(e)
{ {
console.log(`deno.json not found`); console.log(`deno.json not found`);
} }
const Index = ` const Index = `
<!doctype html> <!doctype html>
<html> <html>
<head> <head>
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<script> <script type="importmap">${ImportString}</script>
<script async src="https://ga.jspm.io/npm:es-module-shims@1.5.1/dist/es-module-shims.js" crossorigin="anonymous"></script>
</script>
</head> </head>
<body> <body>
<div id="app">Loading</div> <div id="app">Loading</div>
<script type="importmap">${ImportString}</script>
<script async src="https://ga.jspm.io/npm:es-module-shims@1.5.1/dist/es-module-shims.js" crossorigin="anonymous"></script>
<script type="module"> <script type="module">
import * as TW from "https://esm.sh/@twind/core@1.0.1"; import * as TW from "https://esm.sh/@twind/core@1.0.1";
import TWPreTail from "https://esm.sh/@twind/preset-tailwind@1.0.1"; import TWPreTail from "https://esm.sh/@twind/preset-tailwind@1.0.1";
@ -197,7 +188,7 @@ Deno.serve({ port: 3000 }, async(_req:Request) =>
let type = `text/html`; let type = `text/html`;
let body:BodyInit = Index; let body:BodyInit = Index;
const isLib = url.pathname.startsWith("/lib/") const isLib = url.pathname.startsWith(`/${LibPath}/`)
// serve .tsx .jsx .ts .js // serve .tsx .jsx .ts .js
if(Transpileable(url.pathname)) if(Transpileable(url.pathname))
@ -217,7 +208,7 @@ Deno.serve({ port: 3000 }, async(_req:Request) =>
for( const key in imp ) { members.push(key); } for( const key in imp ) { members.push(key); }
body = body =
` `
import {FileListen} from "hmr"; import {FileListen} from "/${LibPath}/hmr.tsx";
import * as Import from "${url.pathname}?reload=0"; import * as Import from "${url.pathname}?reload=0";
${ members.map(m=>`let proxy_${m} = Import.${m}; ${ members.map(m=>`let proxy_${m} = Import.${m};
export { proxy_${m} as ${m} }; export { proxy_${m} as ${m} };