How to properly define the Typescript type of the feathers client

Question

I'm starting out with feathers 4.3 and Typescript 3.6 and have a question how to properly define the right Typescript type for the feathers client (browser side).

I have taken the react chat code from https://github.com/feathersjs-ecosystem/feathers-chat-react and translated it to Typescript (which was mostly straight forward).

There's the definition of a client in feathers.js:

const client = feathers()

The type of client is inferenced as Application<any>.

The problem comes when I try to call authenticate on the client (application.js):

client.authenticate().catch(() => this.setState({ login: null }))

Typescript tells me that TS2339: Property 'authenticate' does not exist on type 'Application<any>'

It works if I cast the type to any, but I'd rather avoid that.

I would guess the solution is to instantiate it as const client = feathers<MyApplicationType>() instead of not passing a type argument at all?

Is there documentation somewhere how that Typescript type should look like or should be constructed? Is it a union of different service types available on the client?

Thanks for your help!

Answer 1

Try npm install --save @feathersjs/authentication-client. I was getting this same TS error, but fortunately once I spun up feathers inside a docker container i got some additional type errors complaining about not finding the modules @feathersjs/authentication-client, @feathersjs/rest-client, and @feathersjs/primus-client. After I installed those 3 packages, authenticate and reAuthenticate were included on the Application type.

Not sure exactly why that fixed it, but I assume there's some mis-configuration in the @feathersjs/client package.