@intlayer/docs 8.3.0 → 8.3.2

package/docs/uk/configuration.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-08-13
-updatedAt: 2026-03-11
+updatedAt: 2026-03-12
 title: Конфігурація
 description: Дізнайтеся, як налаштувати Intlayer для вашого застосунку. Зрозумійте різні параметри та опції, доступні для налаштування Intlayer відповідно до ваших потреб.
 keywords:
@@ -15,7 +15,7 @@ slugs:
   - configuration
 history:
   - version: 8.3.0
-    data: 2026-03-11
+    date: 2026-03-11
     changes: Перемістити 'baseDir' з конфігурації 'content' до конфігурації 'system'
   - version: 8.2.0
     date: 2026-03-09
@@ -110,7 +110,7 @@ Intlayer підтримує формати файлів конфігурації
 
 ## Приклад файлу конфігурації
 
-```typescript fileName="intlayer.config.ts" codeFormat="typescript"
+````typescript fileName="intlayer.config.ts" codeFormat="typescript"
 import { Locales, type IntlayerConfig } from "intlayer";
 import { nextjsRewrite } from "intlayer/routing";
 import { z } from "zod";
@@ -208,7 +208,7 @@ const config: IntlayerConfig = {
      * Options: 'cookie', 'localStorage', 'sessionStorage', 'header', or an array of these.
      * Default: ['cookie', 'header']
      */
-    storage: "cookie",
+    storage: ["cookie", "header"],
 
     /**
      * Base path for the application URLs.
@@ -274,13 +274,13 @@ const config: IntlayerConfig = {
   editor: {
     /**
      * Whether the visual editor is enabled.
-     * Default: true
+     * Default: false
      */
     enabled: true,
 
     /**
      * URL of your application for origin validation.
-     * Default: "*"
+     * Default: ""
      */
     applicationURL: "http://localhost:3000",
 
@@ -345,6 +345,17 @@ const config: IntlayerConfig = {
      * Base URL for the AI API.
      */
     baseURL: "http://localhost:3000",
+
+    /**
+     * Серіалізація даних
+     *
+     * Опції:
+     * - "json": Стандартний, надійний; використовує більше токенів.
+     * - "toon": Менше токенів, менш послідовний, ніж JSON.
+     *
+     * За замовчуванням: "json"
+     */
+    dataSerialization: "json",
   },
 
   /**
@@ -444,42 +455,70 @@ const config: IntlayerConfig = {
   compiler: {
     /**
      * Вказує, чи має бути увімкнено компілятор.
+     *
+     * - false : Вимкнути компілятор.
+     * - true : Увімкнути компілятор.
+     * - "build-only" : Пропустити компілятор під час розробки для прискорення запуску.
+     *
+     * Значення за замовчуванням : false
      */
     enabled: true,
 
     /**
-     * Pattern to traverse the code to optimize.
-     */
-    transformPattern: [
-      "**/*.{js,ts,mjs,cjs,jsx,tsx,vue,svelte}",
-      "!**/node_modules/**",
-    ],
-
-    /**
-     * Pattern to exclude from the optimization.
+     * Визначає шлях до вихідних файлів. Замінює `outputDir`.
+     *
+     * - Шляхи, що починаються з `./`, розв'язуються відносно каталогу компонента.
+     * - Шляхи, що починаються з `/`, розв'язуються відносно кореня проєкту (`baseDir`).
+     *
+     * - Включення змінної `{{locale}}` у шлях дозволить генерувати словники, розділені за локалями.
+     *
+     * Приклади:
+     * ```ts
+     * {
+     *   // Створює багатомовні файли .content.ts поруч із компонентом
+     *   output: ({ fileName, extension }) => `./${fileName}${extension}`,
+     *
+     *   // output: './{{fileName}}{{extension}}', // Еквівалент з використанням рядкового шаблону
+     * }
+     * ```
+     *
+     * ```ts
+     * {
+     *   // Створює централізовані JSON-файли за локалями в корені проєкту
+     *   output: ({ key, locale }) => `/locales/${locale}/${key}.content.json`,
+     *
+     *   // output: '/locales/{{locale}}/{{key}}.content.json', // Еквівалент з використанням рядкового шаблону
+     * }
+     * ```
+     *
+     * Список змінних:
+     *   - `fileName`: Назва файлу.
+     *   - `key`: Ключ контенту.
+     *   - `locale`: Локаль контенту.
+     *   - `extension`: Розширення файлу.
+     *   - `componentFileName`: Назва файлу компонента.
+     *   - `componentExtension`: Розширення файлу компонента.
+     *   - `format`: Формат словника.
+     *   - `componentFormat`: Формат словника компонента.
+     *   - `componentDirPath`: Шлях до каталогу компонента.
      */
-    excludePattern: ["**/node_modules/**"],
+    output: ({ locale, key }) => `compiler/${locale}/${key}.json`,
 
     /**
-     * Вихідний каталог для оптимізованих словників.
+     * Вказує, чи мають компоненти зберігатися після трансформації.
+     * Таким чином компілятор можна запустити лише один раз для трансформації додатка, а потім видалити.
      */
-    output: ({ key }) => `compiler/${key}.content.json`,
+    saveComponents: false,
 
     /**
-     * Вставте лише вміст у згенерований файл, без ключа.
+     * Вставляти лише вміст у згенерований файл. Корисно для JSON-виводів i18next або ICU MessageFormat для кожної локалі.
      */
     noMetadata: false,
 
     /**
      * Префікс ключа словника
      */
-    dictionaryKeyPrefix: "", // Remove base prefix
-
-    /**
-     * Вказує, чи мають компоненти зберігатися після трансформації.
-     * Таким чином компілятор можна запустити лише один раз для трансформації додатка, а потім видалити.
-     */
-    saveComponents: false,
+    dictionaryKeyPrefix: "", // Додайте необов'язковий префікс для витягнутих ключів словника
   },
 
   /**
@@ -498,7 +537,7 @@ const config: IntlayerConfig = {
 };
 
 export default config;
-```
+````
 
 ## Довідник конфігурації
 
@@ -1098,24 +1137,6 @@ Intlayer підтримує кількох постачальників ШІ д
   - _Примітка_: Ця опція покладається на плагіни `@intlayer/babel` та `@intlayer/swc`.
   - _Примітка_: Переконайтесь, що всі ключі оголошені статично у викликах `useIntlayer`. Наприклад `useIntlayer('navbar')`.
 
-- **importMode**:
-  - _Примітка_: **Deprecated**: Use `dictionary.importMode` instead.
-  - _Тип_: `'static' | 'dynamic' | 'fetch'`
-  - _За замовчуванням_: `'static'`
-  - _Опис_: Керує тим, як імпортуються словники.
-  - _Приклад_: `'dynamic'`
-  - _Примітка_: Доступні режими:
-    - "static": Словники імпортуються статично. Замінює `useIntlayer` на `useDictionary`.
-    - "dynamic": Словники імпортуються динамічно з використанням Suspense. Замінює `useIntlayer` на `useDictionaryDynamic`.
-    - "fetch": Словники отримуються динамічно з використанням live sync API. Замінює `useIntlayer` на `useDictionaryDynamic`.
-  - _Примітка_: Динамічні імпорти залежать від Suspense і можуть дещо вплинути на продуктивність рендерингу.
-  - _Примітка_: Якщо вимкнено, усі локалі будуть завантажені одночасно, навіть якщо вони не використовуються.
-  - _Примітка_: Ця опція покладається на плагіни `@intlayer/babel` та `@intlayer/swc`.
-  - _Примітка_: Переконайтеся, що всі ключі оголошені статично у викликах `useIntlayer`. Наприклад `useIntlayer('navbar')`.
-  - _Примітка_: Ця опція буде ігноруватися, якщо `optimize` вимкнено.
-  - _Примітка_: Якщо встановлено в "live", лише ті словники, які містять віддалений контент і позначені прапорцем "live", будуть перетворені у live-режим. Інші будуть імпортовані динамічно як режим "dynamic" для оптимізації кількості запитів і швидкості завантаження.
-  - _Примітка_: У режимі live буде використовуватися Live Sync API для отримання словників. Якщо виклик API завершиться невдачею, словники будуть імпортовані динамічно в режимі "dynamic".
-  - _Примітка_: Ця опція не вплине на функції `getIntlayer`, `getDictionary`, `useDictionary`, `useDictionaryAsync` та `useDictionaryDynamic`.
 - **checkTypes**:
   - _Тип_: `boolean`
   - _Типово_: `false`
@@ -1155,7 +1176,7 @@ Intlayer підтримує кількох постачальників ШІ д
 
 - **dictionaryKeyPrefix**:
   - _Тип_: `string`
-  - _За замовчуванням_: `'comp-'`
+  - _За замовчуванням_: `''`
   - _Опис_: Префікс для витягнутих ключів словника.
   - _Приклад_: `'my-key-'`
   - _Примітка_: Під час витягування словників ключ генерується на основі назви файлу. Цей префікс додається до згенерованого ключа, щоб запобігти конфліктам.
@@ -1179,30 +1200,37 @@ Intlayer підтримує кількох постачальників ШІ д
   - _Опис_: Шаблони, що визначають, які файли слід виключити під час оптимізації.
   - _Приклад_: `['**/node_modules/**', '!**/node_modules/react/**']`
 
-- **outputDir**:
-  - _Тип_: `string`
-  - _За замовчуванням_: `'compiler'`
-  - _Опис_: Каталог, у якому будуть зберігатися витягнуті словники, відносно базового шляху вашого проекту.
-
 - **output**:
   - _Тип_: `FilePathPattern`
-  - _Типово_: `({ key }) => 'compiler/${key}.content.json'`
-  - _Опис_: Визначає шлях до вихідних файлів. Замінює `outputDir`. Обробляє динамічні змінні, такі як `{{locale}}`, `{{key}}`, `{{fileName}}`, `{{extension}}`, `{{format}}`, `{{dirPath}}`, `{{componentFileName}}`, `{{componentExtension}}` та `{{componentFormat}}`. Можна встановити як рядок у форматі `'my/{{var}}/path'` або як функцію.
-  - _Примітка_: Шляхи `./**/*` розв'язуються відносно компонента. Шляхи `/**/*` розв'язуються відносно `baseDir` Intlayer.
-  - _Приклад_: `output: ({ locale, key }) => 'compiler/${locale}/${key}.json'`
+  - _Типово_: `undefined`
+  - _Опис_: Визначає шлях до вихідних файлів. Замінює `outputDir`. Підтримує динамічні змінні через рядкові шаблони або функцію. Підтримувані змінні: `{{fileName}}`, `{{key}}`, `{{locale}}`, `{{extension}}`, `{{componentFileName}}`, `{{componentExtension}}`, `{{format}}`, `{{componentFormat}}`, та `{{componentDirPath}}`.
+  - _Примітка_: Шляхи, що починаються з `./`, розв'язуються відносно каталогу компонента. Шляхи, що починаються з `/`, розв'язуються відносно кореня проєкту (`baseDir`).
+  - _Примітка_: Включення змінної `{{locale}}` у шлях дозволить генерувати словники, розділені за локалями.
+  - _Приклад_:
+    - **Багатомовний файл поруч із компонентом**:
+    - Рядок: `'./{{fileName}}{{extension}}'`
+    - Функція: `({ fileName, extension }) => \`./${fileName}${extension}\``
+
+    - **Централізовані JSON-файли для кожної локалі**:
+    - Рядок: `'/locales/{{locale}}/{{key}}.content.json'`
+    - Функція: `({ key, locale }) => \`/locales/${locale}/${key}.content.json\``
 
 - **noMetadata**:
   - _Тип_: `boolean`
   - _Типово_: `false`
-  - _Опис_: Вказує, чи мають метадані зберігатися у файлі. Якщо true, компілятор не зберігатиме метадані словників (ключ, оболонка вмісту).
+  - _Опис_: Вказує, чи мають метадані зберігатися у файлі. Якщо true, компілятор не зберігатиме метадані словників (ключ, оболонка вмісту). Корисно для виводу JSON для i18next або ICU MessageFormat для кожної локалі.
   - _Примітка_: Корисно при використанні з плагіном `loadJSON`.
-  - _Приклад_: Якщо `true`:
+  - _Приклад_:
+    Якщо `true` :
+
     ```json
     {
       "key": "value"
     }
     ```
+
     Якщо `false`:
+
     ```json
     {
       "key": "value",

package/docs/uk/intlayer_with_analog.md

@@ -344,8 +344,8 @@ Intlayer використовує розширення модулів (module au
 
 Для цього ви можете додати наступні інструкції до вашого файлу `.gitignore`:
 
-```plaintext
-# Ігнорувати файли, створені Intlayer
+```bash
+#  Ігнорувати файли, створені Intlayer
 .intlayer
 ```
 

package/docs/uk/intlayer_with_angular.md

@@ -400,8 +400,8 @@ Intlayer використовує розширення модулів (module au
 
 Для цього ви можете додати наступні інструкції до вашого файлу `.gitignore`:
 
-```plaintext
-# Ігнорувати файли, створені Intlayer
+```bash
+#  Ігнорувати файли, створені Intlayer
 .intlayer
 ```
 

package/docs/uk/intlayer_with_astro.md

@@ -227,8 +227,8 @@ Intlayer використовує module augmentation, щоб отримати
 
 Для цього можете додати такі інструкції у файл `.gitignore`:
 
-```plaintext
-# Ігнорувати файли, згенеровані Intlayer
+```bash
+#  Ігнорувати файли, згенеровані Intlayer
 .intlayer
 ```
 

package/docs/uk/intlayer_with_lynx+react.md

@@ -515,8 +515,8 @@ Intlayer генерує визначення типів у прихованій
 
 Щоб уникнути коміту автоматично згенерованих файлів Intlayer, додайте наступне до вашого `.gitignore`:
 
-```plaintext
-# Ігнорувати файли, згенеровані Intlayer
+```bash
+#  Ігнорувати файли, згенеровані Intlayer
 .intlayer
 ```
 

package/docs/uk/intlayer_with_nextjs_16.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-12-06
-updatedAt: 2025-12-30
+updatedAt: 2026-03-12
 title: Next.js i18n - Як перекласти додаток Next.js 16 у 2026
 description: Дізнайтеся, як зробити ваш вебсайт на Next.js 16 багатомовним. Дотримуйтесь документації, щоб інтернаціоналізувати (i18n) та перекласти його.
 keywords:
@@ -1695,6 +1695,179 @@ Intlayer використовує розширення модулів (module au
 
 Більш детальну інформацію про те, як користуватися розширенням, можна знайти в [документації розширення Intlayer для VS Code](https://intlayer.org/doc/vs-code-extension).
 
+### (Необов'язково) Крок 1 : Витягніть вміст ваших компонентів
+
+Якщо у вас є існуюча кодова база, перетворення тисяч файлів може зайняти багато часу.
+
+Щоб спростити цей процес, Intlayer пропонує [компілятор](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/compiler.md) / [екстрактор](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/cli/extract.md) для перетворення ваших компонентів і витягування вмісту.
+
+Щоб налаштувати його, ви можете додати розділ `compiler` у свій файл `intlayer.config.ts`:
+
+```typescript fileName="intlayer.config.ts" codeFormat="typescript"
+import { type IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  // ... Інша частина вашої конфігурації
+  compiler: {
+    /**
+     * Вказує, чи повинен бути включений компілятор.
+     */
+    enabled: true,
+
+    /**
+     * Визначає шлях до вихідних файлів
+     */
+    output: ({ fileName, extension }) => `./${fileName}${extension}`,
+
+    /**
+     * Вказує, чи повинні компоненти зберігатися після перетворення. Таким чином, компілятор можна запустити лише один раз для перетворення програми, а потім видалити.
+     */
+    saveComponents: false,
+
+    /**
+     * Префікс ключа словника
+     */
+    dictionaryKeyPrefix: "",
+  },
+};
+
+export default config;
+```
+
+```javascript fileName="intlayer.config.mjs" codeFormat="esm"
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  // ... Інша частина вашої конфігурації
+  compiler: {
+    /**
+     * Вказує, чи повинен бути включений компілятор.
+     */
+    enabled: true,
+
+    /**
+     * Визначає шлях до вихідних файлів
+     */
+    output: ({ fileName, extension }) => `./${fileName}${extension}`,
+
+    /**
+     * Вказує, чи повинні компоненти зберігатися після перетворення. Таким чином, компілятор можна запустити лише один раз для перетворення програми, а потім видалити.
+     */
+    saveComponents: false,
+
+    /**
+     * Префікс ключа словника
+     */
+    dictionaryKeyPrefix: "",
+  },
+};
+
+export default config;
+```
+
+```javascript fileName="intlayer.config.cjs" codeFormat="commonjs"
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  // ... Інша частина вашої конфігурації
+  compiler: {
+    /**
+     * Вказує, чи повинен бути включений компілятор.
+     */
+    enabled: true,
+
+    /**
+     * Визначає шлях до вихідних файлів
+     */
+    output: ({ fileName, extension }) => `./${fileName}${extension}`,
+
+    /**
+     * Вказує, чи повинні компоненти зберігатися після перетворення. Таким чином, компілятор можна запустити лише один раз для перетворення програми, а потім видалити.
+     */
+    saveComponents: false,
+
+    /**
+     * Префікс ключа словника
+     */
+    dictionaryKeyPrefix: "",
+  },
+};
+
+module.exports = config;
+```
+
+<Tabs>
+ <Tab value='Команда витягування'>
+
+Запустіть екстрактор для перетворення компонентів і витягування вмісту
+
+```bash packageManager="npm"
+npx intlayer extract
+```
+
+```bash packageManager="pnpm"
+pnpm intlayer extract
+```
+
+```bash packageManager="yarn"
+yarn intlayer extract
+```
+
+```bash packageManager="bun"
+bunx intlayer extract
+```
+
+ </Tab>
+ <Tab value='Компілятор Babel'>
+
+```bash packageManager="npm"
+npm install @intlayer/babel --save-dev
+```
+
+```bash packageManager="pnpm"
+pnpm add @intlayer/babel --save-dev
+```
+
+```bash packageManager="yarn"
+yarn add @intlayer/babel --save-dev
+```
+
+```bash packageManager="bun"
+bun add @intlayer/babel --dev
+```
+
+```js fileName="babel.config.js"
+const {
+  intlayerExtractBabelPlugin,
+  getExtractPluginOptions,
+} = require("@intlayer/babel");
+
+module.exports = {
+  presets: ["next/babel"],
+  plugins: [
+    // Витягування вмісту з компонентів у словники
+    [intlayerExtractBabelPlugin, getExtractPluginOptions()],
+  ],
+};
+```
+
+```bash packageManager="npm"
+npm run build # Або npm run dev
+```
+
+```bash packageManager="pnpm"
+pnpm run build # Or pnpm run dev
+```
+
+```bash packageManager="yarn"
+yarn build # Or yarn dev
+```
+
+```bash packageManager="bun"
+bun run build # Or bun run dev
+```
+
+ </Tab>
+</Tabs>
+
 ### Йдіть далі
 
 Щоб піти далі, ви можете впровадити [візуальний редактор](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/intlayer_visual_editor.md) або екстерналізувати ваш контент за допомогою [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/intlayer_CMS.md).

package/docs/uk/intlayer_with_nextjs_compiler.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-01-10
-updatedAt: 2026-01-10
+updatedAt: 2026-03-12
 title: Next.js i18n - Перетворення існуючого додатка Next.js на багатомовний додаток у 2026
 description: Дізнайтеся, як зробити ваш існуючий додаток Next.js багатомовним за допомогою Intlayer Compiler. Дотримуйтесь документації, щоб інтернаціоналізувати (i18n) та перекласти ваш додаток за допомогою ШІ.
 keywords:
@@ -501,6 +501,179 @@ Intlayer використовує розширення модулів (module au
 
 Прочитайте [документацію до розширення VS Code Intlayer](https://intlayer.org/doc/vs-code-extension) для отримання детальних інструкцій щодо використання розширення.
 
+### (Необов'язково) Крок 1 : Витягніть вміст ваших компонентів
+
+Якщо у вас є існуюча кодова база, перетворення тисяч файлів може зайняти багато часу.
+
+Щоб спростити цей процес, Intlayer пропонує [компілятор](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/compiler.md) / [екстрактор](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/cli/extract.md) для перетворення ваших компонентів і витягування вмісту.
+
+Щоб налаштувати його, ви можете додати розділ `compiler` у свій файл `intlayer.config.ts`:
+
+```typescript fileName="intlayer.config.ts" codeFormat="typescript"
+import { type IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  // ... Інша частина вашої конфігурації
+  compiler: {
+    /**
+     * Вказує, чи повинен бути включений компілятор.
+     */
+    enabled: true,
+
+    /**
+     * Визначає шлях до вихідних файлів
+     */
+    output: ({ fileName, extension }) => `./${fileName}${extension}`,
+
+    /**
+     * Вказує, чи повинні компоненти зберігатися після перетворення. Таким чином, компілятор можна запустити лише один раз для перетворення програми, а потім видалити.
+     */
+    saveComponents: false,
+
+    /**
+     * Префікс ключа словника
+     */
+    dictionaryKeyPrefix: "",
+  },
+};
+
+export default config;
+```
+
+```javascript fileName="intlayer.config.mjs" codeFormat="esm"
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  // ... Інша частина вашої конфігурації
+  compiler: {
+    /**
+     * Вказує, чи повинен бути включений компілятор.
+     */
+    enabled: true,
+
+    /**
+     * Визначає шлях до вихідних файлів
+     */
+    output: ({ fileName, extension }) => `./${fileName}${extension}`,
+
+    /**
+     * Вказує, чи повинні компоненти зберігатися після перетворення. Таким чином, компілятор можна запустити лише один раз для перетворення програми, а потім видалити.
+     */
+    saveComponents: false,
+
+    /**
+     * Префікс ключа словника
+     */
+    dictionaryKeyPrefix: "",
+  },
+};
+
+export default config;
+```
+
+```javascript fileName="intlayer.config.cjs" codeFormat="commonjs"
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  // ... Інша частина вашої конфігурації
+  compiler: {
+    /**
+     * Вказує, чи повинен бути включений компілятор.
+     */
+    enabled: true,
+
+    /**
+     * Визначає шлях до вихідних файлів
+     */
+    output: ({ fileName, extension }) => `./${fileName}${extension}`,
+
+    /**
+     * Вказує, чи повинні компоненти зберігатися після перетворення. Таким чином, компілятор можна запустити лише один раз для перетворення програми, а потім видалити.
+     */
+    saveComponents: false,
+
+    /**
+     * Префікс ключа словника
+     */
+    dictionaryKeyPrefix: "",
+  },
+};
+
+module.exports = config;
+```
+
+<Tabs>
+ <Tab value='Команда витягування'>
+
+Запустіть екстрактор для перетворення компонентів і витягування вмісту
+
+```bash packageManager="npm"
+npx intlayer extract
+```
+
+```bash packageManager="pnpm"
+pnpm intlayer extract
+```
+
+```bash packageManager="yarn"
+yarn intlayer extract
+```
+
+```bash packageManager="bun"
+bunx intlayer extract
+```
+
+ </Tab>
+ <Tab value='Компілятор Babel'>
+
+```bash packageManager="npm"
+npm install @intlayer/babel --save-dev
+```
+
+```bash packageManager="pnpm"
+pnpm add @intlayer/babel --save-dev
+```
+
+```bash packageManager="yarn"
+yarn add @intlayer/babel --save-dev
+```
+
+```bash packageManager="bun"
+bun add @intlayer/babel --dev
+```
+
+```js fileName="babel.config.js"
+const {
+  intlayerExtractBabelPlugin,
+  getExtractPluginOptions,
+} = require("@intlayer/babel");
+
+module.exports = {
+  presets: ["next/babel"],
+  plugins: [
+    // Витягування вмісту з компонентів у словники
+    [intlayerExtractBabelPlugin, getExtractPluginOptions()],
+  ],
+};
+```
+
+```bash packageManager="npm"
+npm run build # Або npm run dev
+```
+
+```bash packageManager="pnpm"
+pnpm run build # Or pnpm run dev
+```
+
+```bash packageManager="yarn"
+yarn build # Or yarn dev
+```
+
+```bash packageManager="bun"
+bun run build # Or bun run dev
+```
+
+ </Tab>
+</Tabs>
+
 ### Йдемо далі
 
 Для подальшого розвитку ви можете впровадити [візуальний редактор](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/intlayer_visual_editor.md) або винести ваш контент назовні за допомогою [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/intlayer_CMS.md).