Registry /
http-networking / typescript-debounce-decorator
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
muslnode 18–226 runs
build_error
glibcnode 18–226 runs
build_error
Code
Verified usage
Verified import paths — ran on the pinned version, not inferred.
debounce
✓ import { debounce } from 'typescript-debounce-decorator';
✗ import debounce from 'typescript-debounce-decorator';
The `debounce` decorator is a named export, not a default export. Ensure you destructure it correctly.
cancel
✓ import { cancel } from 'typescript-debounce-decorator';
✗ const cancel = require('typescript-debounce-decorator').cancel;
The `cancel` function is also a named export for clearing pending debounced calls. CommonJS `require` syntax is not directly supported.
@debounce
✓ class MyClass { @debounce(1000) myMethod() {} }
✗ class MyClass { @debounce myMethod() {} } // Missing parenthesis, if no options are passed
When using the decorator without any arguments (e.g., just `@debounce`), the parentheses are still required, i.e., `@debounce()` or `@debounce` followed by an argument like `@debounce(1000)`.
This quickstart demonstrates how to apply the `@debounce` decorator to a class method, configure it for leading-edge execution, and use the `cancel` function to prevent pending debounced calls from firing.
import { debounce, cancel } from "typescript-debounce-decorator";
class MyService {
private count: number = 0;
constructor() {
// Simulate user interaction
setInterval(() => {
console.log(`Calling increment by interval... current count: ${this.count}`);
this.increment();
}, 200);
// Schedule a cancellation after some time
setTimeout(() => {
console.log("Attempting to cancel pending increments...");
this.clearPending();
}, 1500);
}
@debounce(1000, { leading: true }) // Debounce for 1 second, fire on leading edge
increment() {
this.count++;
console.log(`Incremented! New count: ${this.count}`);
}
clearPending() {
cancel(this.increment);
console.log("Cancellation command issued.");
}
}
new MyService();
Debug
Known issues
breakingThe `leading` option for the `@debounce` decorator changed its default value from `true` to `false` in version 0.0.18.fixIf your application relies on leading-edge debouncing behavior, you must explicitly set `{ leading: true }` in the decorator options: `@debounce(1000, { leading: true })`. affects: >=0.0.18
gotchaMethods decorated with `@debounce` will have their return values 'eaten' (discarded). The decorator intercepts the method call and does not propagate the return value.fixDesign your decorated methods to perform side effects rather than returning values, or refactor your logic to avoid debouncing methods whose return values are critical for subsequent operations.
affects: All versions
gotchaTypeScript decorators require specific compiler options to be enabled. Without them, you will encounter compilation errors.fixEnsure that `"experimentalDecorators": true` and `"emitDecoratorMetadata": true` are set under `"compilerOptions"` in your `tsconfig.json`.
affects: All versions (TypeScript usage)
Errors
Common errors & fixes
Decorators are not enabled. To enable them, set the 'experimentalDecorators' option to 'true' in your 'tsconfig.json' file.
The TypeScript compiler option `experimentalDecorators` is not enabled.
fixAdd `"experimentalDecorators": true` to the `compilerOptions` section of your `tsconfig.json`.
Cannot find name 'debounce'.
The `debounce` symbol has not been imported or the import path is incorrect.
fixEnsure you have `import { debounce } from 'typescript-debounce-decorator';` at the top of your TypeScript file. ReferenceError: Reflect is not defined OR Error: Reflect.metadata is not a function
The TypeScript compiler option `emitDecoratorMetadata` is enabled, but the `reflect-metadata` polyfill is not loaded at runtime.
fixInstall `reflect-metadata` (`npm install reflect-metadata`) and add `import 'reflect-metadata';` once at the entry point of your application (e.g., `main.ts` or `index.ts`).
Audit
Dependencies
No dependency data recorded yet.