pkg VS Rollup

You don't even need that: https://github.com/vercel/pkg.

I think there are equivalents in the Python ecosystem.

Another exciting feature is the ability to build a single-executable Node.js binary. Before Node.js v18, the only way to build a Node.js binary was to use a third-party package, like pkg.

As a comparison I am using https://github.com/vercel/pkg to package my Node.js app into an exe file. Vercel-pkg allows me to build different images for different platforms like Windows, Linux, Mac. It would be nice if it could produce a single .exe that worked on all platforms. But I guess such an exe would have to be bigger. It is not too cumbersome to produce one exe per platform that my users need.

To run NodeJS as a sidecar we need to pack it into binary. Taurine is bundling your server code and preparing it for packing into a single binary. Using Vercel’s pkg CLI tool we can compile it into a single executable binary. That binary is running with the Tauri application.

What if you packaged the whole thing into one executable using pkg?

In addition to the other responses, there are node packages like pkg and nexe that you can use to package the node executable and your code into a single executable.

Not really, at last check it just bundles the entire .Net runtime with the compiled image. It's basically the equivalent of https://github.com/vercel/pkg or similar tools.

You can even pack your terminal application in a single binary that does not require separate NodeJS installed via pkg.

My go-to front end these days is Lit with web components, rollup, and web dev server.

With tools like webpack (used by create-react-app under the hood), your entire application needs to be bundled in a single file before it can be served to the browser. Vite, on the other hand, takes advantage of native ES modules in the browser to make bundling more efficient with Rollup, serving parts of the source code as needed.

We use Vite as a dev server. This allows you to take advantage of hot reloading in development and easily build and minify code with Rollup integration. Vitest is also provided, so you can write tests in the matching folder.

In this project I use my favorite bundling tool called vite, It is a fast compiler & bundler, and it uses rollup under the hood.

While not too long, css`@apply is a lot to repeat for every class you want to “compile”. That’s why using Vite and some Rollup plugins (Vite uses Rollup under the hood) I was able to shorten it into this:

Most front-end frameworks nowadays include these features as part of their CLI’s such as Create React App, Angular’s ng-cli, etc. For those that don’t, many will use a combination of some type of bundler like Parcel, Rollup, or Webpack and a browser refresher like livereload. This enables you to write code, save it, and immediately see the results. This in turn leads to fast feedback as you iterate all day in this build loop. The native Elm Reactor doesn’t offer this ability and elm-live fits the bill as a small Node.js library to enable this.

Rollup

Hey, thanks for the feedback. Sorry for being dismissive, I can rant when I am angry. :) I checked the new Redux and honestly, it's still a bit confusing. For eg,

> export const { todoAdded, todoToggled } = todosSlice.actions

Where is ".actions" coming from? Because in the object we have "reducers". Is it implicitly generated? Although boilerplate has been greatly reduced, it seems the project is still sticking to the same set of terms, just hidden from the plain sight. Ultimately, I want to understand why we need anything more than actions and state. You call actions, that update the state, that updates any component which is subscribe to that store. What am I missing?

On Bundlers, my problem isn't the fact that they exist, but that you there isn't one that works easily out of the box. What compounds the problem is that practical examples are often missing from docs. This issue is a great example[1]. Crucial plugins are missing from the bundler. Even if you add plugins, you run into problem like sourcemap isn't being generated.

[1]: https://github.com/rollup/rollup/issues/385

After a week (and some prompting), I decided to give it another shot. Once I changed the build tool I was using from microbundle to rollup (and published another 10 versions), I had a working package I was satisfied with. I shared it on a few of the relevant issues on the Chakra UI repo but quickly realized that the next step would be converting the whole thing to TypeScript.

In this post we'll take a look at how to package your JavaScript library code into a production-ready bundle using Rollup module bundler. By the end of this tutorial we will have a dual-module format bundle that is ready to be published to NPM, can be consumed in either server or browser environments, and is available in both ESM and CommonJS formats.