@intlayer/docs 7.0.4 → 7.0.6

package/blog/en-GB/intlayer_with_i18next.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-12-24
-updatedAt: 2025-10-29
+updatedAt: 2025-11-01
 title: How to automate your i18next JSON translations using Intlayer
 description: Automate your JSON translations with Intlayer and i18next for enhanced internationalisation in JavaScript applications.
 keywords:
@@ -20,6 +20,9 @@ slugs:
   - blog
   - intlayer-with-i18next
 history:
+  - version: 7.0.6
+    date: 2025-11-01
+    changes: Add loadJSON plugin
   - version: 7.0.0
     date: 2025-10-29
     changes: Change to syncJSON plugin
@@ -40,6 +43,7 @@ While Intlayer provides an excellent standalone i18n solution (see our [Next.js
 1. **Existing codebase**: You have an established i18next implementation and want to gradually migrate to Intlayer's improved developer experience.
 2. **Legacy requirements**: Your project requires compatibility with existing i18next plugins or workflows.
 3. **Team familiarity**: Your team is comfortable with i18next but wants better content management.
+4. **Using Intlayer features**: You want to use Intlayer features like content declaration, translation keys management, translation status, and more.
 
 **For that, Intlayer can be implemented as an adapter for i18next to help automate your JSON translations in CLI or CI/CD pipelines, test your translations, and more.**
 
@@ -67,6 +71,10 @@ pnpm add intlayer @intlayer/sync-json-plugin
 yarn add intlayer @intlayer/sync-json-plugin
 ```
 
+```bash packageManager="bun"
+bun add intlayer @intlayer/sync-json-plugin
+```
+
 **Package descriptions:**
 
 - **intlayer**: Core library for internationalisation management, content declaration, and building
@@ -76,7 +84,7 @@ yarn add intlayer @intlayer/sync-json-plugin
 
 Create an Intlayer configuration file to define your supported locales:
 
-**If you want to also export JSON dictionaries for i18next**, add the `syncJSON` plugin:
+**If you also want to export JSON dictionaries for i18next**, add the `syncJSON` plugin:
 
 ```typescript fileName="intlayer.config.ts"
 import { Locales, type IntlayerConfig } from "intlayer";
@@ -89,7 +97,7 @@ const config: IntlayerConfig = {
   },
   plugins: [
     syncJSON({
-      source: ({ key, locale }) => `./intl/messages/${locale}/${key}.json`,
+      source: ({ key, locale }) => `./locales/${locale}/${key}.json`,
     }),
   ],
 };
@@ -97,15 +105,60 @@ const config: IntlayerConfig = {
 export default config;
 ```
 
-The `syncJSON` plugin will automatically wrap the JSON. It will read and write the JSON files without changing the content architecture.
+The `syncJSON` plugin will automatically wrap the JSON. It will read and write the JSON files without altering the content architecture.
 
 If you want to make that JSON coexist with Intlayer content declaration files (`.content` files), Intlayer will proceed as follows:
 
     1. load both JSON and content declaration files and transform them into an Intlayer dictionary.
-    2. if there are conflicts between the JSON and the content declaration files, Intlayer will proceed to merge all those dictionaries. This depends on the priority of the plugins and that of the content declaration file (all are configurable).
+    2. if there are conflicts between the JSON and the content declaration files, Intlayer will merge all those dictionaries. This depends on the priority of the plugins and that of the content declaration file (all are configurable).
 
 If changes are made using the CLI to translate the JSON, or using the CMS, Intlayer will update the JSON file with the new translations.
 
+To see more details about the `syncJSON` plugin, please refer to the [syncJSON plugin documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/plugins/sync-json.md).
+
+### (Optional) Step 3: Implement per-component JSON translations
+
+By default, Intlayer will load, merge and synchronise both JSON and content declaration files. See [the content declaration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/dictionary/content_file.md) for more details. But if you prefer, using an Intlayer plugin, you can also implement per-component management of JSON localised anywhere in your codebase.
+
+For that, you can use the `loadJSON` plugin.
+
+```ts fileName="intlayer.config.ts"
+import { Locales, type IntlayerConfig } from "intlayer";
+import { loadJSON, syncJSON } from "@intlayer/sync-json-plugin";
+
+const config: IntlayerConfig = {
+  internationalisation: {
+    locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
+    defaultLocale: Locales.ENGLISH,
+  },
+
+  // Keep your current JSON files in sync with Intlayer dictionaries
+  plugins: [
+    /**
+     * Will load all the JSON files in the src that match the pattern {key}.i18n.json
+     */
+    loadJSON({
+      source: ({ key }) => `./src/**/${key}.i18n.json`,
+      locale: Locales.ENGLISH,
+      priority: 1, // Ensures these JSON files take precedence over files at `./locales/en/${key}.json`
+    }),
+    /**
+     * Will load, and write the output and translations back to the JSON files in the locales directory
+     */
+    syncJSON({
+      source: ({ key, locale }) => `./locales/${locale}/${key}.json`,
+      priority: 0,
+    }),
+  ],
+};
+
+export default config;
+```
+
+This will load all the JSON files in the `src` directory that match the pattern `{key}.i18n.json` and load them as Intlayer dictionaries.
+
+---
+
 ## Git Configuration
 
 It is recommended to ignore auto-generated Intlayer files:
@@ -122,5 +175,3 @@ These files can be regenerated during your build process and do not need to be c
 For an improved developer experience, install the official **Intlayer VS Code Extension**:
 
 [Install from the VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
-
-[Install from the VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)

package/blog/en-GB/intlayer_with_next-i18next.md

@@ -16,6 +16,9 @@ slugs:
   - blog
   - intlayer-with-next-i18next
 history:
+  - version: 7.0.6
+    date: 2025-11-01
+    changes: Add loadJSON plugin
   - version: 7.0.0
     date: 2025-10-29
     changes: Change to syncJSON plugin and comprehensive rewrite
@@ -76,13 +79,13 @@ pnpm add intlayer @intlayer/sync-json-plugin
 yarn add intlayer @intlayer/sync-json-plugin
 ```
 
+```bash packageManager="bun"
+bun add intlayer @intlayer/sync-json-plugin
+```
+
 **Package explanations:**
 
 - **intlayer**: Core library for content declaration and management
-- **next-intlayer**: Next.js integration layer with build plugins
-- **i18next**: Core i18n framework
-- **next-i18next**: Next.js wrapper for i18next
-- **i18next-resources-to-backend**: Dynamic resource loading for i18next
 - **@intlayer/sync-json-plugin**: Plugin to synchronise Intlayer content declarations to i18next JSON format
 
 ### Step 2: Implement the Intlayer plugin to wrap the JSON
@@ -102,7 +105,7 @@ const config: IntlayerConfig = {
   },
   plugins: [
     syncJSON({
-      source: ({ key, locale }) => `./messages/${locale}/${key}.json`,
+      source: ({ key, locale }) => `./public/locales/${locale}/${key}.json`,
     }),
   ],
 };
@@ -115,10 +118,55 @@ The `syncJSON` plugin will automatically wrap the JSON. It will read and write t
 If you want to make that JSON coexist with Intlayer content declaration files (`.content` files), Intlayer will proceed as follows:
 
     1. load both JSON and content declaration files and transform them into an Intlayer dictionary.
-    2. if there are conflicts between the JSON and the content declaration files, Intlayer will proceed to merge all those dictionaries. This depends on the priority of the plugins and that of the content declaration file (all are configurable).
+    2. if there are conflicts between the JSON and the content declaration files, Intlayer will merge all those dictionaries. This depends on the priority of the plugins, and that of the content declaration file (all are configurable).
 
 If changes are made using the CLI to translate the JSON, or using the CMS, Intlayer will update the JSON file with the new translations.
 
+To see more details about the `syncJSON` plugin, please refer to the [syncJSON plugin documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/plugins/sync-json.md).
+
+---
+
+### (Optional) Step 3: Implement per-component JSON translations
+
+By default, Intlayer will load, merge and synchronise both JSON and content declaration files. See [the content declaration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/dictionary/content_file.md) for more details. But if you prefer, using an Intlayer plugin, you can also implement per-component management of JSON localised anywhere in your codebase.
+
+For that, you can use the `loadJSON` plugin.
+
+```ts fileName="intlayer.config.ts"
+import { Locales, type IntlayerConfig } from "intlayer";
+import { loadJSON, syncJSON } from "@intlayer/sync-json-plugin";
+
+const config: IntlayerConfig = {
+  internationalization: {
+    locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
+    defaultLocale: Locales.ENGLISH,
+  },
+
+  // Keep your current JSON files in sync with Intlayer dictionaries
+  plugins: [
+    /**
+     * Will load all the JSON files in the src that match the pattern {key}.i18n.json
+     */
+    loadJSON({
+      source: ({ key }) => `./src/**/${key}.i18n.json`,
+      locale: Locales.ENGLISH,
+      priority: 1, // Ensures these JSON files take precedence over files at `./public/locales/en/${key}.json`
+    }),
+    /**
+     * Will load, and write the output and translations back to the JSON files in the locales directory
+     */
+    syncJSON({
+      source: ({ key, locale }) => `./public/locales/${locale}/${key}.json`,
+      priority: 0,
+    }),
+  ],
+};
+
+export default config;
+```
+
+This will load all the JSON files in the `src` directory that match the pattern `{key}.i18n.json` and load them as Intlayer dictionaries.
+
 ---
 
 ## Git Configuration
@@ -135,8 +183,6 @@ These files are automatically regenerated during the build process and do not ne
 
 ### VS Code Extension
 
-For an improved developer experience, install the official **Intlayer VS Code Extension**:
-
-[Install from the VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
+For improved developer experience, install the official **Intlayer VS Code Extension**:
 
 [Install from the VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)

package/blog/en-GB/intlayer_with_next-intl.md

@@ -7,6 +7,9 @@ slugs:
   - blog
   - intlayer-with-next-intl
 history:
+  - version: 7.0.6
+    date: 2025-11-01
+    changes: Add loadJSON plugin
   - version: 7.0.0
     date: 2025-10-29
     changes: Change to syncJSON plugin
@@ -54,6 +57,10 @@ pnpm add intlayer @intlayer/sync-json-plugin
 yarn add intlayer @intlayer/sync-json-plugin
 ```
 
+```bash packageManager="bun"
+bun add intlayer @intlayer/sync-json-plugin
+```
+
 **Package descriptions:**
 
 - **intlayer**: Core library for internationalisation management, content declaration, and building
@@ -70,7 +77,7 @@ import { Locales, type IntlayerConfig } from "intlayer";
 import { syncJSON } from "@intlayer/sync-json-plugin";
 
 const config: IntlayerConfig = {
-  internationalization: {
+  internationalisation: {
     locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
     defaultLocale: Locales.ENGLISH,
   },
@@ -86,13 +93,57 @@ export default config;
 
 The `syncJSON` plugin will automatically wrap the JSON. It will read and write the JSON files without changing the content architecture.
 
-If you want to make that JSON coexist with Intlayer content declaration files (`.content` files), Intlayer will proceed as follows:
+If you want to make that JSON coexist with intlayer content declaration files (`.content` files), Intlayer will proceed as follows:
+
+    1. load both JSON and content declaration files and transform them into an intlayer dictionary.
 
-    1. load both JSON and content declaration files and transform them into an Intlayer dictionary.
-    2. if there are conflicts between the JSON and the content declaration files, Intlayer will proceed to merge all those dictionaries. This depends on the priority of the plugins and that of the content declaration file (all are configurable).
+    2. if there are conflicts between the JSON and the content declaration files, Intlayer will proceed to merge all those dictionaries. This depends on the priority of the plugins, and that of the content declaration file (all are configurable).
 
 If changes are made using the CLI to translate the JSON, or using the CMS, Intlayer will update the JSON file with the new translations.
 
+For more details about the `syncJSON` plugin, please refer to the [syncJSON plugin documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/plugins/sync-json.md).
+
+### (Optional) Step 3: Implement per-component JSON translations
+
+By default, Intlayer will load, merge and synchronise both JSON and content declaration files. See [the content declaration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/dictionary/content_file.md) for more details. However, if you prefer, using an Intlayer plugin, you can also implement per-component management of JSON localised anywhere in your codebase.
+
+For that, you can use the `loadJSON` plugin.
+
+```ts fileName="intlayer.config.ts"
+import { Locales, type IntlayerConfig } from "intlayer";
+import { loadJSON, syncJSON } from "@intlayer/sync-json-plugin";
+
+const config: IntlayerConfig = {
+  internationalization: {
+    locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
+    defaultLocale: Locales.ENGLISH,
+  },
+
+  // Keep your current JSON files in sync with Intlayer dictionaries
+  plugins: [
+    /**
+     * Will load all the JSON files in the src that match the pattern {key}.i18n.json
+     */
+    loadJSON({
+      source: ({ key }) => `./src/**/${key}.i18n.json`,
+      locale: Locales.ENGLISH,
+      priority: 1, // Ensures these JSON files take precedence over files at `./locales/en/${key}.json`
+    }),
+    /**
+     * Will load, and write the output and translations back to the JSON files in the locales directory
+     */
+    syncJSON({
+      source: ({ key, locale }) => `./messages/${locale}/${key}.json`,
+      priority: 0,
+    }),
+  ],
+};
+
+export default config;
+```
+
+This will load all the JSON files in the `src` directory that match the pattern `{key}.i18n.json` and load them as Intlayer dictionaries.
+
 ## Git Configuration
 
 It is recommended to ignore auto-generated Intlayer files:
@@ -109,5 +160,3 @@ These files can be regenerated during your build process and do not need to be c
 For an improved developer experience, install the official **Intlayer VS Code Extension**:
 
 [Install from the VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
-
-[Install from the VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)

package/blog/en-GB/intlayer_with_react-i18next.md

@@ -18,6 +18,9 @@ slugs:
   - blog
   - intlayer-with-react-i18next
 history:
+  - version: 7.0.6
+    date: 2025-11-01
+    changes: Add loadJSON plugin
   - version: 7.0.0
     date: 2025-10-29
     changes: Change to syncJSON plugin
@@ -38,10 +41,11 @@ While Intlayer provides an excellent standalone i18n solution (see our [React in
 1. **Existing codebase**: You have an established react-i18next implementation and want to gradually migrate to Intlayer's improved developer experience.
 2. **Legacy requirements**: Your project requires compatibility with existing react-i18next plugins or workflows.
 3. **Team familiarity**: Your team is comfortable with react-i18next but wants better content management.
+4. **Using Intlayer features**: You want to use Intlayer features like content declaration, translation automation, testing translations, and more.
 
 **For that, Intlayer can be implemented as an adapter for react-i18next to help automate your JSON translations in CLI or CI/CD pipelines, test your translations, and more.**
 
-This guide shows you how to leverage Intlayer's superior content declaration system while maintaining compatibility with react-i18next.
+This guide shows you how to leverage Intlayer's superior content declaration system whilst maintaining compatibility with react-i18next.
 
 ## Table of Contents
 
@@ -65,6 +69,10 @@ pnpm add intlayer @intlayer/sync-json-plugin
 yarn add intlayer @intlayer/sync-json-plugin
 ```
 
+```bash packageManager="bun"
+bun add intlayer @intlayer/sync-json-plugin
+```
+
 **Package descriptions:**
 
 - **intlayer**: Core library for internationalisation management, content declaration, and building
@@ -74,7 +82,7 @@ yarn add intlayer @intlayer/sync-json-plugin
 
 Create an Intlayer configuration file to define your supported locales:
 
-**If you want to also export JSON dictionaries for react-i18next**, add the `syncJSON` plugin:
+**If you also want to export JSON dictionaries for react-i18next**, add the `syncJSON` plugin:
 
 ```typescript fileName="intlayer.config.ts"
 import { Locales, type IntlayerConfig } from "intlayer";
@@ -87,7 +95,7 @@ const config: IntlayerConfig = {
   },
   plugins: [
     syncJSON({
-      source: ({ key, locale }) => `./messages/${locale}/${key}.json`,
+      source: ({ key, locale }) => `./locales/${locale}/${key}.json`,
     }),
   ],
 };
@@ -99,12 +107,53 @@ The `syncJSON` plugin will automatically wrap the JSON. It will read and write t
 
 If you want to make that JSON coexist with Intlayer content declaration files (`.content` files), Intlayer will proceed as follows:
 
-    1. load both JSON and content declaration files and transform them into an Intlayer dictionary.
-    2. if there are conflicts between the JSON and the content declaration files, Intlayer will proceed to merge all those dictionaries. This depends on the priority of the plugins, and that of the content declaration file (all are configurable).
+    1. Load both JSON and content declaration files and transform them into an Intlayer dictionary.
+    2. If there are conflicts between the JSON and the content declaration files, Intlayer will merge all those dictionaries. This depends on the priority of the plugins and that of the content declaration file (all are configurable).
 
 If changes are made using the CLI to translate the JSON, or using the CMS, Intlayer will update the JSON file with the new translations.
 
-For more details about the `syncJSON` plugin, please refer to the [syncJSON plugin documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/plugins/sync-json.md).
+To see more details about the `syncJSON` plugin, please refer to the [syncJSON plugin documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/plugins/sync-json.md).
+
+### (Optional) Step 3: Implement per-component JSON translations
+
+By default, Intlayer will load, merge and synchronise both JSON and content declaration files. See [the content declaration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/dictionary/content_file.md) for more details. But if you prefer, using an Intlayer plugin, you can also implement per-component management of JSON localised anywhere in your codebase.
+
+For that, you can use the `loadJSON` plugin.
+
+```ts fileName="intlayer.config.ts"
+import { Locales, type IntlayerConfig } from "intlayer";
+import { loadJSON, syncJSON } from "@intlayer/sync-json-plugin";
+
+const config: IntlayerConfig = {
+  internationalisation: {
+    locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
+    defaultLocale: Locales.ENGLISH,
+  },
+
+  // Keep your current JSON files in sync with Intlayer dictionaries
+  plugins: [
+    /**
+     * Will load all the JSON files in the src that match the pattern {key}.i18n.json
+     */
+    loadJSON({
+      source: ({ key }) => `./src/**/${key}.i18n.json`,
+      locale: Locales.ENGLISH,
+      priority: 1, // Ensures these JSON files take precedence over files at `./locales/en/${key}.json`
+    }),
+    /**
+     * Will load, and write the output and translations back to the JSON files in the locales directory
+     */
+    syncJSON({
+      source: ({ key, locale }) => `./locales/${locale}/${key}.json`,
+      priority: 0,
+    }),
+  ],
+};
+
+export default config;
+```
+
+This will load all the JSON files in the `src` directory that match the pattern `{key}.i18n.json` and load them as Intlayer dictionaries.
 
 ## Git Configuration
 

package/blog/en-GB/intlayer_with_react-intl.md

@@ -16,6 +16,9 @@ slugs:
   - blog
   - intlayer-with-react-intl
 history:
+  - version: 7.0.6
+    date: 2025-11-01
+    changes: Add loadJSON plugin
   - version: 7.0.0
     date: 2025-10-29
     changes: Change to syncJSON plugin
@@ -23,6 +26,10 @@ history:
 
 # How to automate your react-intl JSON translations using Intlayer
 
+## Table of Contents
+
+<TOC/>
+
 ## What is Intlayer?
 
 **Intlayer** is an innovative, open-source internationalisation library designed to address the shortcomings of traditional i18n solutions. It offers a modern approach to content management in React applications.
@@ -36,6 +43,7 @@ While Intlayer provides an excellent standalone i18n solution (see our [React in
 1. **Existing codebase**: You have an established react-intl implementation and want to gradually migrate to Intlayer's improved developer experience.
 2. **Legacy requirements**: Your project requires compatibility with existing react-intl plugins or workflows.
 3. **Team familiarity**: Your team is comfortable with react-intl but wants better content management.
+4. **Using Intlayer features**: You want to use Intlayer features like content declaration, translation automation, testing translations, and more.
 
 **For that, Intlayer can be implemented as an adapter for react-intl to help automate your JSON translations in CLI or CI/CD pipelines, test your translations, and more.**
 
@@ -63,6 +71,10 @@ pnpm add intlayer @intlayer/sync-json-plugin
 yarn add intlayer @intlayer/sync-json-plugin
 ```
 
+```bash packageManager="bun"
+bun add intlayer @intlayer/sync-json-plugin
+```
+
 **Package descriptions:**
 
 - **intlayer**: Core library for internationalisation management, content declaration, and building
@@ -72,7 +84,7 @@ yarn add intlayer @intlayer/sync-json-plugin
 
 Create an Intlayer configuration file to define your supported locales:
 
-**If you want to also export JSON dictionaries for react-intl**, add the `syncJSON` plugin:
+**If you also want to export JSON dictionaries for react-intl**, add the `syncJSON` plugin:
 
 ```typescript fileName="intlayer.config.ts"
 import { Locales, type IntlayerConfig } from "intlayer";
@@ -98,11 +110,52 @@ The `syncJSON` plugin will automatically wrap the JSON. It will read and write t
 If you want to make that JSON coexist with Intlayer content declaration files (`.content` files), Intlayer will proceed as follows:
 
     1. load both JSON and content declaration files and transform them into an Intlayer dictionary.
-    2. if there are conflicts between the JSON and the content declaration files, Intlayer will proceed to merge all those dictionaries. This depends on the priority of the plugins, and that of the content declaration file (all are configurable).
+    2. if there are conflicts between the JSON and the content declaration files, Intlayer will merge all those dictionaries. This depends on the priority of the plugins and that of the content declaration file (all are configurable).
 
 If changes are made using the CLI to translate the JSON, or using the CMS, Intlayer will update the JSON file with the new translations.
 
-For more details about the `syncJSON` plugin, please refer to the [syncJSON plugin documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-plugins/sync-json.md).
+To see more details about the `syncJSON` plugin, please refer to the [syncJSON plugin documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/plugins/sync-json.md).
+
+### (Optional) Step 3: Implement per-component JSON translations
+
+By default, Intlayer will load, merge and synchronise both JSON and content declaration files. See [the content declaration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/dictionary/content_file.md) for more details. But if you prefer, using an Intlayer plugin, you can also implement per-component management of JSON localised anywhere in your codebase.
+
+For that, you can use the `loadJSON` plugin.
+
+```ts fileName="intlayer.config.ts"
+import { Locales, type IntlayerConfig } from "intlayer";
+import { loadJSON, syncJSON } from "@intlayer/sync-json-plugin";
+
+const config: IntlayerConfig = {
+  internationalisation: {
+    locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
+    defaultLocale: Locales.ENGLISH,
+  },
+
+  // Keep your current JSON files in sync with Intlayer dictionaries
+  plugins: [
+    /**
+     * Will load all the JSON files in the src that match the pattern {key}.i18n.json
+     */
+    loadJSON({
+      source: ({ key }) => `./src/**/${key}.i18n.json`,
+      locale: Locales.ENGLISH,
+      priority: 1, // Ensures these JSON files take precedence over files at `./locales/en/${key}.json`
+    }),
+    /**
+     * Will load, and write the output and translations back to the JSON files in the locales directory
+     */
+    syncJSON({
+      source: ({ key, locale }) => `./messages/${locale}/${key}.json`,
+      priority: 0,
+    }),
+  ],
+};
+
+export default config;
+```
+
+This will load all the JSON files in the `src` directory that match the pattern `{key}.i18n.json` and load them as Intlayer dictionaries.
 
 ## Git Configuration