Bug Report: Circular Structure Error in Hot Reload with .11ty.js Files

[teamchan3]

I encountered a build error related to circular structure when using .11ty.js files. The error occurs specifically during hot reloading after editing the file.

Steps to Reproduce:

1. Create a new index.11ty.js file with the following content: export default "<p>aaa</p>";

2. Run Eleventy in serve mode: npx @11ty/eleventy --serve

3. Edit and save index.11ty.js in an editor.

4. The following error is thrown in the console, and the hot reload fails: reload-client.js:21 [11ty][02:36:03.136 UTC] Build error: Converting circular structure to JSON

Expected Behavior:

The hot reload should work without throwing an error when editing .11ty.js files.

Actual Behavior:

When editing and saving the file, a “Converting circular structure to JSON” error is thrown, and hot reload does not work.

Error Log:

reload-client.js:21 [11ty][02:36:03.136 UTC] Build error: Converting circular structure to JSON
    --> starting at object with constructor 'Object'
    |     property 'page' -> object with constructor 'Object'
    --- property 'rawInput' closes the circle
{stack: 'TypeError: Converting circular structure to JSON\n …de_modules/@11ty/eleventy/src/Eleventy.js:1207:4)', message: "Converting circular structure to JSON\n    --> star…ct'\n    --- property 'rawInput' closes the circle"}

• Eleventy version: 3.0.0 • Node.js version: 22.1.0 • OS: maxOS 15.0.1

This issue only seems to occur with .11ty.js files; it does not happen with .njk files. It appears related to the hot reload process involving reload-client.js.

I would appreciate any guidance on how to resolve this or whether a fix is required.

This format should provide enough clarity and detail for the Eleventy team to investigate the issue.

[Snapstromegon]

Hi @teamchan3, I can see that you also filed https://github.com/11ty/eleventy/issues/3481 which is in the correct repo. Because of this, I'll close this issue here. Thanks for bringing it up!