lingui.config.ts file in Twenty, the #1 open-source CRM.

Ramu NarasingaRamu Narasinga
2 min read

In this article, we will review lingui.config.ts file in Twenty, the #1 open-source CRM. We will look at:

  1. What is Lingui?

  2. lingui.config.ts in Twenty

What is Lingui?

Lingui is an internationalization framework for global products.

It is a JavaScript library for internationalization (i18n) of JavaScript projects. Supports React (including RSC and React Native), Vue, Node.js, and more.

Why choose Lingui?

  1. Universal

  2. Powerful tooling

  3. Full Rich-Text support

  4. AI Translation Ready

  5. Headache-Free Professional Localization

Workflow

  1. Define Messages

  2. Extract

  3. Translate

  4. Compile

  5. Deploy

Example

import { Trans } from "@lingui/react/macro"

function App() {
  return (
    <Trans
      id="msg.docs" // Optional message id
      comment="Docs link on the website" // Comment for translators, optional
    >
      Read the <a href="https://lingui.dev">documentation</a>
      for more info.
    </Trans>
  )
}

Configuration

By default, Lingui looks for the configuration in the following locations:

  • lingui.config.js or lingui.config.ts file exporting a configuration object (recommended).

  • .linguirc file in JSON format.

  • lingui section in package.json.

You can also define the environment variable LINGUI_CONFIG with the path to your config file.

Learn more about config

lingui.config.ts in Twenty

In twenty/packages/twenty-front/lingui.config.ts, you will find the following code:

import { defineConfig } from '@lingui/conf';
import { formatter } from '@lingui/format-po';
import { APP_LOCALES, SOURCE_LOCALE } from 'twenty-shared/translations';

export default defineConfig({
  sourceLocale: 'en',
  locales: Object.values(APP_LOCALES),
  pseudoLocale: 'pseudo-en',
  fallbackLocales: {
    'pseudo-en': 'en',
    default: SOURCE_LOCALE,
  },
  catalogs: [
    {
      path: '<rootDir>/src/locales/{locale}',
      include: ['src'],
    },
  ],
  catalogsMergePath: '<rootDir>/src/locales/generated/{locale}',
  compileNamespace: 'ts',
  format: formatter({ lineNumbers: false, printLinguiId: true }),
});

For all the options defined in this above code, please refer to documentation.

About me

Hey, my name is Ramu Narasinga. I study codebase architecture in large open-source projects.

Email: ramu.narasinga@gmail.com

Build Shadcn CLI from scratch.

References:

  1. https://github.com/twentyhq/twenty/blob/main/packages/twenty-front/lingui.config.ts

  2. https://lingui.dev/ref/conf

0
Subscribe to my newsletter

Read articles from Ramu Narasinga directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Ramu Narasinga
Ramu Narasinga

I study large open-source projects and create content about their codebase architecture and best practices, sharing it through articles, videos.