question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Allow ES-style import { debounce } from "debounce"?

See original GitHub issue

As this module works now, it violates ES6/ES2015-style module export rules. See this SO question and answer for why TypeScript cares and this bug on DefinitelyTyped for additional reasoning why it’s inconvenient to users.

To not break the existing const debounce = require("debounce"); for users, I propose the object be given a .debounce member so we can also import it using const { debounce } = require("debounce"); (or var debounce = require("debounce").debounce; for the traditional folks).

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:4
  • Comments:11 (2 by maintainers)

github_iconTop GitHub Comments

2reactions
JoshuaKGoldbergcommented, Jul 4, 2018

create a definition, as suggested here.

Alas, that isn’t a workable or future-proof solution. ☹

There’s a good reason why TypeScript refuses to acknowledge the type declaration for debounce: what it’s doing isn’t compatible with ES modules, only CommonJS. ES modules don’t allow the exported object to be callable (a function). It can contain members that are functions, but it itself must be an object.

This will not work in systems that properly implement the new spec:

import * as debounce from "debounce";

// This should give an error about not being callable
debounce(...);

…while this is allowed and encouraged:

import { debounce } from "debounce";

debounce(...);

Links in the OP for why this is the case.

1reaction
JoshuaKGoldbergcommented, Oct 16, 2018

@ChuckJonas yup, the problem there is that the debounce package was updated but your TypeScript typings in the @types/debounce package were not.

https://github.com/DefinitelyTyped/DefinitelyTyped/pull/29768

Once that PR is merged, as soon as a new version of @types/debounce is published (normally within a few hours) it’ll have the right change.

Read more comments on GitHub >

github_iconTop Results From Across the Web

use-debounce - npm
Start using use-debounce in your project by running `npm i use-debounce`. ... import React, { useState } from 'react'; import { useDebounce } ......
Read more >
How to Correctly Debounce and Throttle Callbacks in React
1. The callback without debouncing. Let's say that a component <FilterList> accepts a big list of names (at least 200 records). The ...
Read more >
How to perform debounce? - Stack Overflow
Solved it using setTimeout and clearTimeout . I will give an example that you could adapt: import React, { Component } from ' ......
Read more >
Debounce – How to Delay a Function in JavaScript (JS ES6 ...
In JavaScript, a debounce function makes sure that your code is only triggered once per user input. Search box suggestions, text-field ...
Read more >
How and when to debounce or throttle in React
import { DebounceInput } from 'react-debounce-input' ... Instead of our current <input/> tag in the JSX code, let's paste this:
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found