SethTrowbridge/esbuild-wasm-bundler
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

cleanup

Browse Source
This commit is contained in:
Seth Trowbridge 2024-06-10 16:23:31 -04:00
parent fe33072cd5
commit 0cc2d914e1
5 changed files with 61 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
bundler-inc.tsx
View File

@ -1,13 +1,8 @@
import B from "./mod.ts";
import Bundler from "./mod.ts";
const results = await B({
imports: {
"react": "https://esm.sh/preact@10.22.0/compat",
"react/": "https://esm.sh/preact@10.22.0/compat/"
}
});
const results = await Bundler();
for await(const file of results.outputFiles)
{
console.log(file.path);
console.log(file.text);
}

6
introspect.tsx → introspect.ts
View File

@ -6,14 +6,16 @@ type JsonLike = JsonDeep
type Configuration = {imports:JsonDeep, compilerOptions:JsonDeep};
export const Root = new URL(`file://${Deno.cwd().replaceAll("\\", "/")}`).toString();
/** A `file://` url version of Deno.cwd() */
export const Root = new URL(`file://${Deno.cwd().replaceAll("\\", "/")}`).toString() + "/";
export default async function HuntConfig()
{
let path:string, json:JsonLike|undefined;
const loadJSON =async(inPath:string)=>{
try{
const resp = await fetch(Root + "/" + inPath);
const resp = await fetch(Root + inPath);
if(inPath.endsWith(".jsonc"))
{
const text = await resp.text();

77
mod.ts
View File

@ -1,52 +1,27 @@
import * as ESBuild from "https://deno.land/x/esbuild@v0.19.2/wasm.js";
import * as Mapper from "https://esm.sh/esbuild-plugin-importmaps@1.0.0"; // https://github.com/andstellar/esbuild-plugin-importmaps
import Introspect, {Root} from "./introspect.ts";
export const Root = new URL(`file://${Deno.cwd().replaceAll("\\", "/")}`).toString()+"/";
console.log("running at", Root);
type Resolver = Parameters<ESBuild.PluginBuild["onResolve"]>[1];
const prefix = "/_dot_importer_/";
const Resolver:Resolver =(args)=>
{
console.log("RESOLVE");
console.log("in:", args);
const resolvePlugin:ESBuild.Plugin = {
name: "resolve-plugin",
setup(build) {
build.onResolve({ filter: /^(\.\/|\.\.\/).*/ }, (args)=>
{
let resolveRoot = args.importer||Root;
if(resolveRoot.startsWith(prefix))
{
resolveRoot = resolveRoot.substring(prefix.length)
resolveRoot = resolveRoot.substring(prefix.length);
}
const output:ESBuild.OnResolveResult = {
path:prefix + new URL(args.path, resolveRoot).href,
namespace:"http",
}
console.log("out:", output);
return output;
}
const FetchTSX =async(inPath:string):Promise<ESBuild.OnLoadResult>=>
{
console.log("fetching", inPath);
const result = await fetch(inPath);
const contents = await result.text();
return { contents, loader: `tsx` };
}
const resolvePlugin:ESBuild.Plugin = {
name: "resolve-plugin",
setup(build) {
build.onResolve({ filter: /^\.\/.*$/ }, Resolver);
build.onResolve({ filter: /^(\.\.\/).*$/ }, Resolver);
});
build.onLoad({ filter: /.*/, namespace:"http" }, async(args)=> {
console.log("LOAD WEB");
console.log("in:", args);
const fetchPath = args.path.substring(prefix.length);
console.log("fetching", fetchPath);
const result = await fetch(fetchPath);
const contents = await result.text();
return { contents, loader: `tsx` };
@ -54,30 +29,36 @@ const resolvePlugin:ESBuild.Plugin = {
},
};
type ImportMap = Parameters<typeof Mapper.importmapPlugin>[0];
export type ImportMap = Parameters<typeof Mapper.importmapPlugin>[0];
export type BuildOptions = ESBuild.BuildOptions;
export default async function(buildOptions={} as BuildOptions, importMap:ImportMap|false = false)
{
if(importMap === false)
{
importMap = await Introspect() as ImportMap;
}
await ESBuild.initialize({ worker: false });
const result = await ESBuild.build({
const configuration:ESBuild.BuildOptions = {
//entryPoints: ["./app.tsx"],
entryPoints: ["./deep/deep.tsx"],
entryPoints: ["entry"],
//entryPoints: ["./deep/deep.tsx"],
//entryPoints: ["http://localhost:4507/deep/deep.tsx"],
bundle: true,
minify: true,
format: "esm",
jsx: "automatic",
jsxImportSource: "react",
plugins:[
...buildOptions,
plugins: [
resolvePlugin,
Mapper.importmapPlugin({
imports:{
"react":"https://esm.sh/preact@10.22.0/compat"
}
}) as ESBuild.Plugin
Mapper.importmapPlugin(importMap) as ESBuild.Plugin,
...buildOptions.plugins||[]
]
});
};
await ESBuild.initialize({ worker: false });
const result = await ESBuild.build(configuration);
ESBuild.stop();
for(const item of result.outputFiles)
{
//console.log(item.text)
return result;
}
export { ESBuild };

4
other.tsx
View File

@ -1,3 +1,3 @@
import React from "react";
console.log(React.createElement("div", {}, "hey"));
//import React from "react";
//console.log(React.createElement("div", {}, "hey"));
export default "TEST STRING";

26
serve.tsx
View File

@ -1,9 +1,4 @@
import bundler from "./mod.ts";
import Introspect, {Root} from "./introspect.tsx";
const Config = await Introspect();
console.log(Config.imports);
const transpiled:Map<string, string> = new Map();
@ -13,18 +8,31 @@ Deno.serve(async(req)=>{
if(index > -1)
{
const ext = url.pathname.substring(index+1, index+3);
console.log(ext);
console.log(url.pathname);
if(ext === "ts")
{
const results = await bundler({imports:Config.imports}, {
entryPoints:[Root+url.pathname],
const results = await bundler({
entryPoints:["."+url.pathname],
outfile:"bundle.js",
entryNames: `[dir][name]`,
});
results.outputFiles?.forEach(output=>{
transpiled.set(output.path, output.text);
})
return new Response(results.outputFiles[0].text, {headers:{"content-type":"application/javascript"}});
return new Response(`
path: ${results.outputFiles[0].path}
hash: ${results.outputFiles[0].hash}
`, {headers:{"content-type":"application/javascript"}});
}
if(ext == "js")
{
return new Response(transpiled.get(url.pathname)||"---", {headers:{"content-type":"application/javascript"}});
}
return new Response(Root+url.pathname);
}
return new Response(url.pathname);
});