If this was important to me, I'd just use jQuery, though HTMX also looks like it'd work well (just haven't used it yet, so can't speak with authority).
Writing JavaScript without a build system
111–120 of 187 posts
Re: Writing JavaScript without a build system
#112Use Vite and don't look back. It's so refreshing compared to Webpack.
You’re missing the entire point. That’s still a build process and still has additional overhead for both development and deployment.
Vite is so lightweight it feels more like http server than a build system.
The reason why it’s needed at all is it adapts npm packages that are not es modules. It gives you access to all of npm while requiring very little in return.
You can even turn off any transpilation/minification if you want to it to be more 1:1.
Re: Writing JavaScript without a build system
#113If anyone's looking for something like a framework that works with buildless workflows you might check out the project I work on: Lit ( https://lit.dev ) Lit gives you reactive components, declarative HTML templates, runtime encapsulated DOM and styles, interoperability with frameworks and HTML via web components, and a lot more - with no required build tools at all. We take great care to make sure our libraries are…
I just want to point out there is a great alternative from Microsoft called `fast-design`[0] which provides a more fleshed out experience than Lit does, in terms of out of the box components. It does have lower level packages if you don't want ready made components too [0]: https://www.fast.design/
FAST works without tools as well: https://www.fast.design/docs/fast-element/defining-elements
FAST is kind of like a Lit-clone (though it patches global prototypes) plus a design system base.
There are lots of design systems built with Lit that you can chose from instead of us including our own: Shoelace, Adobe Spectrum, Redhat Patternfly, IBM Carbon, Material Web Components and more.
Re: Writing JavaScript without a build system
#114Earlier quoted context omitted.
I've been looking for a modern JS library that doesn't require a build step, and I've always skipped over Lit because I thought it depended on a build until this comment. Is there any documentation about using it without a build? All the documentation and tutorials seem to assume a build step. I've found several different "getting started" entrypoints on the site, and they all begin with "npm install" and "import {Li…
Some of this depends on what you consider a build step. I generally don't consider installing from npm a build step. I also don't really consider rewriting import specifiers a build step - it's just locating files on disk. Regardless, we do have some workflows for completely "tool-less" (or local-tool-less). - We publish bundles to jsDelivr: https://lit.dev/docs/getting-started/#use-bundles - You can import directly…
if you change your application code on disk and reload the page and it works, then there's no build step. 1-time setup actions like installing from NPM aren't considered.
Re: Writing JavaScript without a build system
#115Earlier quoted context omitted.
Mostly because you want your project to just work. You've tested your project with a certain version of Node, and you want to ensure that you use the same exact version when you come back to the project in a year and want to perform some minor updates. You can set the node constraint in package.json, but that doesn't install the correct version of Node for you, unlike nvm.
Well that makes sense, as long as the developer running the code has nvm installed. Does nvm-windows read and install the versions in these nvmrc files? If it does your strategy is indeed pretty cool and I might start doing it myself. I wonder if there's any way to force specific versions of NodeJS without relying on nvm or some compatible tool. edit: someone here in this thread suggested Volta [0] which seems litera…
Wow, Volta does look like exactly what I've been looking for.
Re: Writing JavaScript without a build system
#116I agree with calling out esbuild as a great, minimal, stable tool.
I recently had the chance to start a small greenfield project. As we have a lot of "tribal knowledge" of Vue I decided to keep it, but go with a "minimum viable tooling" approach. This means esbuild with no plugins, .tsx instead of .vue files (because esbuild natively supports TSX), no hot module reloading (just esbuild's simple refresh-the-page-on-build), and absolutely no CSS-in-JS, just a single style.css using BEM conventions.
The same approach would probably work with any other frontend framework that can use JSX or plain JS files, even if you do run it through esbuild before it gets to the browser.
In my experience, most of the complexity that creeps into JS projects is fancy build tools. Using fewer, better tools which focus on standards-compliant content is the way forward.
Re: Writing JavaScript without a build system
#117If anyone's looking for something like a framework that works with buildless workflows you might check out the project I work on: Lit ( https://lit.dev ) Lit gives you reactive components, declarative HTML templates, runtime encapsulated DOM and styles, interoperability with frameworks and HTML via web components, and a lot more - with no required build tools at all. We take great care to make sure our libraries are…
First of all, thank you for the work you have done on this, I love lit, use it all the time at work.
One thing I struggle with from time to time is that if I have a web component created in lit, and somewhere inside I have a dependency that has some CSS, that CSS doesn’t seem to work when the web component is consumed by JS.
The only workaround I found was to override the behaviour and instead of returning a shadow dom, return the component on its own, but that has its own downsides.
Re: Writing JavaScript without a build system
#118My goto build system is:
- make
- Google's closure compiler (standalone Jar)
- imagemagick
It builds fast and never goes out of date.
Re: Writing JavaScript without a build system
#119AMD was a great module system precisely because the build step was optional. Running the build helped on large projects (for bundling, minifying, etc.), but you could literally deploy your frontend's `src` directory to production and expect it to work as-is. A nice side-effect was that local development only required a simple file http service. I'm hoping ES module tooling, import maps, etc. get us back to that point…
Indeed. I miss AMD and tooling from that time, it was all pretty straightforward and browser focused. Combined with PHP and you could do some pretty neat things, too.
Re: Writing JavaScript without a build system
#120If anyone's looking for something like a framework that works with buildless workflows you might check out the project I work on: Lit ( https://lit.dev ) Lit gives you reactive components, declarative HTML templates, runtime encapsulated DOM and styles, interoperability with frameworks and HTML via web components, and a lot more - with no required build tools at all. We take great care to make sure our libraries are…
Most devs have no idea what lit-html + DOM event + sub 100 lines glue code (mvc) is capable of. No useThis useThat non-sense, just call render() manually, really, it's not a big deal like at all.