hot reloading of 11ty ESM config dependencies (v3)

[jens-struct]

Is your feature request related to a problem? Please describe.

Imports inside the ESM 11ty config file are not reevaluated in 11ty version 3, i mean there is no hot reloading of these dependencies while being in watch mode.

Describe the solution you'd like

Hot reloading of ESM 11ty config dependencies works while being in watch mode.

Describe alternatives you've considered

No response

Additional context

The (old) related issue for CommonJS modules: #1052

For ESM it is probably not possible because "The esm cache is not exposed, and even if it were, it is not mutable." (More info here: nodejs/help#2806)

In my usecase i used a cachebuster, like described here: https://ar.al/2021/02/22/cache-busting-in-node.js-dynamic-esm-imports/#cache-invalidation-in-esm-with-dynamic-imports (please note: this causes a memory leak)

So, as far as i understand, adding hot relaoding for ESM is not possible in a standard way for now? Or did i miss something here?

(Otherwise 11ty v3 works really well, great work!)

Thanks! 🙏

[zachleat]

A cache buster does exist for ESM in 11ty, must be a regression here.

[jens-struct]

FYI: I experienced it for importing nunjucks filter, shortcodes, ... from external files. A reload does happen, when the file is changed, but the updated content isn't included.

And as far as i understand, you have to add a cachebuster for your own imports. Or is there some 11ty magic, where 11ty adds these to all ESM imports?

[zachleat]

Shipping with v3.0.0-alpha.14, using module.register to cache bust dependencies when logged as changed by the file watcher.

https://nodejs.org/docs/latest/api/module.html#moduleregisterspecifier-parenturl-options

[noelleleigh]

@zachleat I think the fix for this issue (6b8e53e) broke a workflow:

Versions:

• Node.js v20.15.1 (installed via nvm)
• Eleventy 3.0.0-alpha.14 through 3.0.0-alpha.17
• Google Chrome 126.0.6478.178

I try to use the Chrome DevTools for Node.js to profile my 11ty build with this command:

node --inspect-brk ./node_modules/.bin/eleventy

After connecting the debugger and resuming execution, the build hangs. When I manually pause the debugger, it's stuck here in 11ty code:

eleventy/src/Util/Require.js

Line 17 in 7128d07

module.register("./EsmResolver.js", import.meta.url, {

Deeper into the stack, execution has stopped here:

https://github.com/nodejs/node/blob/a407d1f0b3669cc82c755700f0d500fb27cc39ea/lib/internal/modules/esm/hooks.js#L592

The stack at that point looks like

    at HooksProxy.waitForWorker (node:internal/modules/esm/hooks:592:9)
    at HooksProxy.makeSyncRequest (node:internal/modules/esm/hooks:666:10)
    at CustomizedModuleLoader.register (node:internal/modules/esm/loader:466:23)
    at ModuleLoader.register (node:internal/modules/esm/loader:331:33)
    at Function.register (node:internal/modules/esm/loader:615:35)
    at file:///home/noelle/dev/www/node_modules/@11ty/eleventy/src/Util/Require.js:17:9
    at ModuleJob.run (node:internal/modules/esm/module_job:222:25)
    at async ModuleLoader.import (node:internal/modules/esm/loader:316:24)

When I use Eleventy 3.0.0-alpha.13, the problem doesn't manifest and I can debug through the entire build without issue.

[zachleat]

@noelleleigh filed at #3371