react-select/async and Typescript

Hi!

I can’t seem to find a proper way to resolve this issue. When I try to import Async select I get a following TS error.

import SelectAsync from 'react-select/async';

Error:

Could not find a declaration file for module ‘react-select/async’. ‘<removed>/node_modules/react-select/async/dist/react-select.cjs.js’ implicitly has an ‘any’ type.ts(7016)

I found a couple of old threads online with the similar issue but none of the suggestions there could help. Any ideas how to resolve this?

Relevant packages from package.json:

"react-select": "^3.0.3",
"typescript": "^3.4.5",
"@types/react-select": "^2.0.19"

[Methuselah96]

I made a PR to update the types: https://github.com/DefinitelyTyped/DefinitelyTyped/pull/36464.

[justingrant]

@StanBright and others looking for a TS workaround, here’s what I did to solve this problem for react-select/creatable. You should be able to do something similar for react-select/async:

1. Create a node_modules subfolder in my src folder. (not a typo-- put it inside your /src folder because you’ll want to check it into git!)
2. Create a ./src/node_modules/react-select folder
3. Create a ./src/node_modules/react-select/creatable folder
4. Add a typings file in that folder: ./src/node_modules/react-select/creatable/index.d.ts and populate it with this content: EDIT: added one more line to handle non-default exports (thanks @dhruvio!)

import Creatable from 'react-select/lib/Creatable';
export * from 'react-select/lib/Creatable';
export default Creatable;

Doing this enables imports like this to work:

import Select from 'react-select/creatable';
import { Props as SelectProps } from 'react-select/creatable';

Once the 3.0 typings are populated in DefinitelyTyped, you should be able to remove this hack.