No Node!

[mveytsman]

This is a PR against a default LiveView (0.15.7) that removes all use of Node/NPM/Webpack.

There's no bundling of assets in any way -- we just copy /assets directly into /priv/static (see hacky_watcher.sh). We're relying on the browser's ESM support to be able to load javascript modules directly. We also don't do any CSS preprocessing - the .scss file phoenix ships with is valid css, so I just renamed it to cut a preprocessing step.

Normally, a bare module import (e.g. import "morphdom") won't work in the browser since it doesn't know where to import the module from. Luckily there's a proposal for import-maps which map module names to locations. This amounts to a poor man's package.json running in the browser! See import-map.json for an example.

Chromium supports import-maps, and we vendor a polyfill to get it to work on other browsers, reducing our requirement to browsers that support ESM.

In the example I vendor the phoenix dependencies and rely on rely SkyPack as a CDN for other modules we're using. SkyPack also let's me refer to package@version

---

This PR lets you run without any node in development. I think it's missing a few things to be used for your production builds:

1. We shouldn't recreate sprockets but we're going to want an elixir-based watcher.
2. People will want loaders for sass and friends
3. I don't think we want import maps in production builds, so we'll need a bundler loader thingy.

Options to bundle javacript for production without node

• deno - single binary that lets us run JS. Unfortunately wont support tailwind yet
• esbuild - single go binary (though packaged via npm for some reason), used by snowpack and vite to handle typescript. Kind of beta, but seems to have the pieces we need. Here's docs for tailwind + alpine with esbuild
• Write our own bundler and tell people to use webpack if they need features it doesn't provide?

[aadamsx]

Why hasn't this PR been accepted?

[mveytsman]

We went for something similar here: phoenixframework/phoenix#4377