Install Packages and Feathers Client ​

Install required packages, including the (optional) Feathers Dove Client.

Install Packages ​

You'll need these packages installed to use the Feathers Client, even if you're going to use the typed client from your Feathers v5 Dove API.

Pinia and Feathers-Pinia ​

Install these packages using your preferred package manager. Until version 2.0, it's recommended that you add a ~ in front of the version number for Feathers-Pinia to only get patch releases.

npm i pinia feathers-pinia@pre

Feathers Packages ​

If your app will use socket.io, install these packages:

npm i @feathersjs/feathers @feathersjs/authentication-client @feathersjs/socketio-client socket.io-client

If your app will use feathers-rest (no realtime connection), install these packages:

npm i @feathersjs/feathers @feathersjs/authentication-client @feathersjs/rest-client

Install Typed Client ​

The FeathersJS v5 Dove CLI creates a typed client application for you. Use these steps to install the client from a Dove-based API:

Prepare ​

Check the package.json file in your Dove API's codebase to make sure it's ready to bundle. We won't be publishing to npm, but instead will bundle the client into the public directory of the Feathers app. The most important part is to make sure you have the correct name and version configured:

{
  "name": "feathers-pinia-api",
  "version": "0.0.3",
  "scripts": {
    "bundle:client": "npm run compile && npm pack --pack-destination ./public"
  }
}

Bundle ​

After preparing the correct information in the package.json, you're ready to run the bundle script:

npm run bundle:client

After the script runs, you should see a corresponding versioned client .tgz file in the public directory. These files are the same format as any npm package. If you're running Node.js version 16+, you can install this package directly into your client application.

feathers-pinia-api/
├─ node_modules/
├─ public/
│  ├─ feathers-pinia-api-0.0.0.tgz
│  ├─ feathers-pinia-api-0.0.1.tgz
│  ├─ feathers-pinia-api-0.0.2.tgz
│  ├─ feathers-pinia-api-0.0.3.tgz
├─ src/
├─ package.json

Install ​

Follow these instructions to install the bundled client into your application:

• Start the API server. The API server must be running in order to serve the file from public. The default Feathers API configuration starts the application on http://localhost:3030.

• Open your client application and run the following command, specifying the correct hostname for your API server and the correct filename to match your API server's package.json name.

  bash

  npm i http://localhost:3030/feathers-pinia-api-0.0.3.tgz

  Note

  Unless you're running the `feathers-pinia-api` example repo, the above command will fail unless you customize the URL for the running host and filename.

To check that the package installed correctly, look at the dependencies in your package.json. The package will be named the same as your API's name attribute in the api repo's package.json.

{
  "dependencies": {
    "feathers-pinia-api": "http://localhost:3030/feathers-pinia-api-0.0.3.tgz",
  }
}

Ship to Production ​

You'll use a variation of the above process when shipping to production. Ship your Feathers API, first, including the client .tgz builds. Then you can update your CI build to install from the production API instead of from localhost:3030.

File-based Alternative ​

As an alternative to updating a CI process, you can consider copying the client file into your client repo and installing it from the file you copied into your client application. If you check this file into your client's git repo, you won't have to customize the CI process.

npm i ./clients/feathers-pinia-api-0.0.3.tgz

Update the Client ​

Sometimes you may run into an issue when trying to update the client package. Even though you've specified the new version number in the package.json, the old version will be installed. To work around this, sometimes you have to wipe out the node_modules folder and reinstall packages with the new version number in place.

Important Notes ​

SSG Compatibility ​

See the Common Patterns page to see an example of SSG-friendly localStorage.

Errors with Fetch Setup ​

If you're upgrading from Feathers v4 Crow and you receive an error like this one:

"Error: Failed to execute 'fetch' on 'Window': Illegal invocation"

You can fix this by binding window to fetch, as is also shown in the above examples.

window.fetch.bind(window)