Documentation for UserConfig type definitions doesn't work in ESM

[sentience]

Operating system

macOS Sonoma 14.2

Eleventy

3.0.0-alpha.2

Describe the bug

The 11ty docs recommend this as the way to get TypeScript-powered autocomplete on the eleventyConfig object:

/** @param {import("@11ty/eleventy").UserConfig} eleventyConfig */
module.exports = function (eleventyConfig) {
  // …
};

After converting my Eleventy project to ESM per the 3.0 alpha announcement, I found that this autocomplete was no longer working. Updating the type import to reference the actual file path fixes the issue for me:

/** @param { import("@11ty/eleventy/src/UserConfig.js") } eleventyConfig */
export default function (eleventyConfig) {
  // …
};

I'm not an expert in JSDoc, so I can't say whether there's a downside to this approach (other than the increased verbosity and dependency on Eleventy's internals), but it's what I'm using now. Absent a better suggestion, the Eleventy 3.0 docs and migration guide will probably need to mention this necessary change to preserve the previously-documented functionality.

Reproduction steps

1. Clone https://github.com/sentience/kevinyank.com/tree/demo-esm-autocomplete-broken
2. npm install
3. Open .eleventy.js in Visual Studio Code.
4. Hover over the eleventyConfig parameter on line 9. Note that Visual Studio Code annotates it as having type any.

Expected behavior

The type should be annotated as UserConfig.

Reproduction URL

https://github.com/sentience/kevinyank.com/tree/demo-esm-autocomplete-broken

Screenshots

No response

[rubenwardy]

#3097

[zachleat]

Ah, good catch! I’ll fix the export to include userconfig

[oliverpool]

In my case I had to add .default:

/** @param { import("@11ty/eleventy/src/UserConfig.js").default } eleventyConfig */
export default function (eleventyConfig) {

[zachleat]

Duplicate of #3097, /** @param {import("@11ty/eleventy").UserConfig} eleventyConfig */ works in 3.0.0-alpha.12+