Installing the client

Dico.app client is the library that makes working with dico easy, it allows you to fetch and use your dico seamlessly.

In the previous step the CLI might have asked you to init the client for you.

If you picked yes, you can skip this section and just to writing keys ->

Else continue reading:

Installing the Client

To install the client, start by installing it with your favorite package manager:

npm install @dico/client

yarn add @dico/client

The client library comes with a script that you need to use in order to fetch your current dico locally and populate the dico.data.json file. This also comes in as handy with your CI/CD system when using webhooks.

To have it working we recommend you to update your package.json scripts as follows:

package.json{
    /* ... */
    "scripts": {
        "dev": "dico-fetch && ...",
        "build": "dico-fetch && ..."
    }
}

package.json{
    /* ... */
    "scripts": {
        "dev": "dico-fetch && nuxt",
        "generate": "dico-fetch && nuxt generate",
        "build": "dico-fetch && nuxt build",
        "start": "nuxt start" // Not needed for start!
    }
}

package.json{
    /* ... */
    "scripts": {
        "dev": "dico-fetch && next",
        "build": "dico-fetch && next build",
        "start": "next start" // Not needed for start!
    }
}

package.json{
    /* ... */
    "scripts": {
        "clean": "gatsby clean", // Not needed for clean!
        "start": "npm run develop", // Not needed for start!
        "build": "npm run clean && dico-fetch && gatsby build",
        "develop": "npm run clean && dico-fetch && gatsby develop",
        "serve": "gatsby serve" // Not needed for serve!
    }
}

This will create or update the dico.data.json file whenever you start or build your project. We recommend you to gitignore this file:

.gitignore

# ...

dico.data.json

💡 When inside a project folder you can use the CLI fetch command to run the fetch script manually.

Initing the Client

Last step before we can start writing keys is initing the client, it goes like this:

src/dico.(js|ts)import { createDico } from "@dico/client";
// Dico data file is created next to your `dico.config.json` file
import data from "../dico.data.json";

export const { $dico, $dicoI18n } = createDico(data);

src/dico.jsconst { createDico } = require("@dico/client");
// Dico data file is created next to your `dico.config.json` file
const data = require("../dico.data.json");

const { $dico, $dicoI18n } = createDico(data);

exports.$dico = $dico;
exports.$dicoI18n = $dicoI18n;

And voilà! We're done initing the client inside our project.

We're now ready to start writing keys within our project ->

Installing the client

Installing the Client

Updating Your Scripts

Initing the Client

Table of Contents