JSDoc plugin that adds full ES2022+ class-feature support – private fields, static members, arrow-bound methods, as well as ES6 default export fixes.
Modern JavaScript syntax isn’t always accurately recognized by JSDoc. This plugin enables accurate recognition of modern ECMAScript class structures and enhances the resulting documentation.
- Restores accurate naming for native
#privateFieldsand#methods(). - Automatically tags private members with
@private. - Detects
staticclass members and applies@staticandscope: static. - Treats arrow-bound methods as
@function. - Detects assignments like
this.#foo = ...in constructors. - Fixes various ES6 default export issues - corrects wrong names and structures for exported classes, functions, object literals, and their members.
- Static class properties are correctly parsed with static scope instead of instance scope.
- ES6 class mixin static members retain their static scope during augmentation.
- Works seamlessly with JSDoc's default parser.
- Works with all themes (but see note below!).
- Perfectly integrates with VisionTheme for a modern UI (optional).
- Tested with JSDoc 3.6.11 and 4.0.4.
npm install --save-dev @alphanull/jsdoc-plugin-esnextThen, add the plugin to your JSDoc configuration file:
{
"plugins": [
"@alphanull/jsdoc-plugin-esnext"
]
}export default class Example {
/**
* Static counter
* @type {number}
*/
static counter = 0;
/**
* Private field
* @type {string}
*/
static #secret = 'abc';
/**
* Bound handler
* @function
*/
#handleClick = () => {
console.log('clicked');
}
constructor() {
this.#local = 123;
}
/**
* Private method
*/
#compute() {
return true;
}
}![]() |
![]() |
|---|---|
| Without plugin | Using jsdoc-plugin-esnext |
counterappears with@staticand type.#secretis listed asprivate static.#handleClickis listed as a private function.#compute()is listed as a private method.
/**
* Exported as default class.
*/
export default class FooClass {
/**
* FooClass constructor.
* @param {string} message - Additional message.
*/
constructor(message) { }
/**
* This is a class method.
* @param {any} someArg - An arg you need to pass.
*/
classMethod(someArg) {
this.fooAClassMethod(this.message);
}
}![]() |
![]() |
|---|---|
| Without plugin | Using jsdoc-plugin-esnext |
FooClassis named correctly (notexports).- Class members (constructor, properties, methods) are correctly linked to their parent class and do not appear in
Global.
/**
* ES6 class mixin with static members.
* @mixin TestMixin
*/
class TestMixin {
/**
* Static property - correctly parsed as static scope.
* @type {string}
*/
static staticProp = 'static';
/**
* Static method - correctly retains static scope during augmentation.
* @returns {string}
*/
static staticMethod() {
return 'static';
}
}
/**
* Class using the mixin.
* @class TestClass
* @mixes TestMixin
*/
class TestClass extends TestMixin {
/**
* Class static property - correctly parsed as static scope.
* @type {string}
*/
static classStaticProp = 'classStatic';
}![]() |
![]() |
|---|---|
| Without plugin | Using jsdoc-plugin-esnext |
TestClass.staticPropappears with@staticand scopestatic(fixes JSDoc Bug #2144).TestClass.staticMethodretains static scope during mixin augmentation (fixes JSDoc Bug #2146).TestClass.classStaticPropis correctly parsed as static scope.
While there are no limitations with this plugin per se, for private members (which start with "#") there can be resulting hash links containing two hashes, like: <a href="##privateMember">#privateMember</a> which can lead to broken links. Unfortunately, this cannot be handled by the plugin itself and needs to be managed by the theme.
The good news is that documenting modern code typically requires a modern theme anyway. Consider using the brand-new JSDoc VisionTheme, which addresses this issue and is fully tested and optimized for compatibility with this plugin.
Copyright © 2025–present Frank Kudermann @ alphanull.de





