Is there a way to bundle multiple files into one file using `esbuild_deno_loader` and `esbuild`?
I'm trying to bundle multiple files in a single folder into one JS file that needs to end up in the
static folder of Fresh. Is there a way to do that using esbuild_deno_loader and esbuild?9 Replies
Thanks, Nick. I tried something like your script, but if I create an array of file paths that I want to bundle into the
outfile as the entryPoints property value, esbuild says that I need to use the outDir property, not outfile. but that creates a folder of esbuild transformed files. Instead I want just one bundle file.
Yes, I ended up creating a mod.ts file that exported all the other files in that folder and used it for the entryPoints, but that requires that I update mod.ts everytime I create a new file. I'd like for new files to automatically be picked up by esbuild. This is for my Web Components work with Fresh, so the normal bundling that Fresh does not work here, because I the WC file bundle needs to end up in a static folder. I'd prefer to stick with TS here too.
Does your code transform TS into JS?
I'm looking to transform many TS files into a single JS file.
I thank you for your examples, Nick, but I'd rather not build my own way to do this. I would think that esbuild should be able to transform TS files into a single JS file. Does anybody know how to do this?tsup is a wrapper aroundn esbuild and rollup and it can output to a single file, might be what you're after? https://tsup.egoist.dev/#bundle-filestsup
bundle typescript library with ease
The
bundle: true option must be set for esbuild to bundle things into a single file. If it's not set it won't bundleThank you, Coby, for the suggestion. I will check that out.
Thanks for your help, Marvin. I tried your suggestion, but it doesn't work for multiple input files where the
outdir property needs to be used instead of outfile. In that case, bundle is ignored. Instead I went with a mod.ts file as described above.Right yeah multiple entry points get their own bundles. The typical approach in that case is to create a virtual entry that imports all the entries you want in a single bundle
Yes, but as I explained above, it requires that I add each new Web Component file to
mod.ts. I was hoping that there was an automated way to bundle all the files into the bundle rather than using mod.ts.BTW, this is the repo containing the file Nick was referring to: https://github.com/cdoremus/fresh-webcomponents
GitHub
GitHub - cdoremus/fresh-webcomponents: Demos how to use Web Compone...
Demos how to use Web Components with Deno Fresh. Contribute to cdoremus/fresh-webcomponents development by creating an account on GitHub.
I'd prefer to skip
mod.ts and just have all the WC files bundled together into wc.esm.js.
It would be nice to be able to bundle by hooking into the built-in TS->JS transforms that Deno uses.
I'd like to concentrate on the blog post accompanying this code for now. The most complex thing about the prototype you suggested is the TS->JS transformation which is why I'd like to hook into what Deno does.
I'm not sure that adding WC deployment to Fresh 2.0 would have widespread appeal except to those like you and I that like to do Vanilla JS for the client side.
Thanks Nick. I'm hoping to try this out tomorrow.
Not sure. I'm sorry, but I'm busy with 'domestic activities' this week. So stay tuned.