Integrating Nudeps with Eleventy (aka Build Awsome)

For years, the JavaScript ecosystem has relied on bundlers to manage dependencies and optimize delivery. But as browsers gain stronger native module support, an alternative approach is emerging.

With Nudeps we explore a world where dependency management happens without bundlers. Relying instead on import maps and browser-native modules. Pair it with Eleventy (aka. Build Awsome), a lightweight static site generator, and you get a workflow that feels much closer to the original spirit of the web: simple, modular, and build-light.

Installing Nubeps

Initializing Nudep is as easy as

npx nudeps install

This will install nudeps package and adds a dependencies and prepare to your package.json

Nudeps instantly goes to work and creates a client_modules/ folder and and importmap.js in the root of your site. Technically all you have to to now is to refecence this file in you main template:

<script src="/importmap.js"></script>

eleventyConfig.addPassthroughCopy("client_modules");
eleventyConfig.addPassthroughCopy("importmap.js");

For some projects that use the root folder of the project as the root of their eleventy site this would basically finish the job. But most projects a "src/" as the root of their site.