import { Locales, type Dictionary } from "intlayer";const exampleContent = {  key: "example",  locale: Locales.ENGLISH,  autoFill: "./example.content.json",  content: {    contentExample: "这是一个内容示例",  },} satisfies Dictionary;export default exampleContent;

这是一个使用 autoFill 指令的按语言环境划分的内容声明文件。

然后，当你运行以下命令时：

bash

复制代码

复制代码到剪贴板

npx intlayer fill --file 'src/components/example/example.content.ts'

Intlayer 将自动生成派生的声明文件，路径为 src/components/example/example.content.json，并填充主文件中尚未声明的所有语言环境。

src/components/example/example.content.json

复制代码

复制代码到剪贴板

{  "key": "example",  "content": {    "contentExample": {      "nodeType": "translation",      "translation": {        "fr": "Ceci est un exemple de contenu",        "es": "Este es un ejemplo de contenido",      },    },  },}

之后，这两个声明文件将合并为一个字典，可以通过标准的 useIntlayer("example") 钩子（React）或组合函数（Vue）访问。

自动填充文件格式

推荐的自动填充声明文件格式是 JSON，这有助于避免格式限制。然而，Intlayer 也支持 .ts、.js、.mjs、.cjs 及其他格式。

src/components/example/example.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: "./example.filled.content.ts",  content: {    // 你的内容  },};

这将生成文件于：

plaintext

复制代码

复制代码到剪贴板

src/components/example/example.filled.content.ts

.js、.ts 及类似文件的生成方式如下：

如果文件已存在，Intlayer 将使用 AST（抽象语法树）解析文件，定位每个字段并插入任何缺失的翻译。
如果文件不存在，Intlayer 将使用默认的内容声明文件模板生成它。

绝对路径

autoFill 字段也支持绝对路径。

src/components/example/example.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: "/messages/example.content.json",  content: {    // 你的内容  },};

这将生成文件于：

plaintext

复制代码

复制代码到剪贴板

/messages/example.content.json

自动生成每个语言环境的内容声明文件

autoFill 字段还支持生成每个语言环境的内容声明文件。

src/components/example/example.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: {    fr: "./example.fr.content.json",    es: "./example.es.content.json",  },  content: {    // 您的内容  },};

这将生成两个独立的文件：

src/components/example/example.fr.content.json
src/components/example/example.es.content.json

在这种情况下，如果对象不包含所有语言，Intlayer 将跳过剩余语言的生成。

过滤特定语言的自动填充

为 autoFill 字段使用对象可以让您应用过滤器，只生成特定语言的文件。

src/components/example/example.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: {    fr: "./example.fr.content.json",  },  content: {    // 您的内容  },};

这将只生成法语翻译文件。

路径变量

您可以在 autoFill 路径中使用变量，以动态解析生成文件的目标路径。

可用变量：

{{locale}} – 语言代码（例如 fr，es）
{{fileName}} – 文件名（例如 index）
{{key}} – 字典键（例如 example）

src/components/example/index.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: "/messages/{{locale}}/{{key}}.content.json",  content: {    // 您的内容  },};

这将生成：

/messages/fr/example.content.json
/messages/es/example.content.json

src/components/example/index.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: "./{{fileName}}.content.json",  content: {    // 您的内容  },};

这将生成：

./index.content.json
./index.content.json

编译器

测试

Creation:2025-03-13Last update:2025-09-20

将此文档参考到您的 AI 助手

ChatGPT

Claude

DeepSeek

Google AI mode Gemini

Perplexity Mistral

Grok

使用您最喜欢的AI助手总结文档，并引用此页面和AI提供商

版本历史

"添加全局配置"
v6.0.02025/9/20
"添加 `{{fileName}}` 变量"
v6.0.02025/9/17
"初始化历史"
v5.5.102025/6/29

此页面的内容已使用 AI 翻译。

查看英文原文的最新版本

编辑此文档

如果您有改善此文档的想法，请随时通过在GitHub上提交拉取请求来贡献。

文档的 GitHub 链接

Copy

复制文档 Markdown 到剪贴板

自动填充内容声明文件翻译

自动填充内容声明文件 是加快开发工作流程的一种方式。

src/components/example/example.content.ts

复制代码

复制代码到剪贴板

import { Locales, type Dictionary } from "intlayer";const exampleContent = {  key: "example",  locale: Locales.ENGLISH,  autoFill: "./example.content.json",  content: {    contentExample: "这是一个内容示例",  },} satisfies Dictionary;export default exampleContent;

import { Locales, type Dictionary } from "intlayer";const exampleContent = {  key: "example",  locale: Locales.ENGLISH,  autoFill: "./example.content.json",  content: {    contentExample: "这是一个内容示例",  },} satisfies Dictionary;export default exampleContent;

这是一个使用 autoFill 指令的按语言环境划分的内容声明文件。

然后，当你运行以下命令时：

bash

复制代码

复制代码到剪贴板

npx intlayer fill --file 'src/components/example/example.content.ts'

npx intlayer fill --file 'src/components/example/example.content.ts'

Intlayer 将自动生成派生的声明文件，路径为 src/components/example/example.content.json，并填充主文件中尚未声明的所有语言环境。

src/components/example/example.content.json

复制代码

复制代码到剪贴板

{  "key": "example",  "content": {    "contentExample": {      "nodeType": "translation",      "translation": {        "fr": "Ceci est un exemple de contenu",        "es": "Este es un ejemplo de contenido",      },    },  },}

{  "key": "example",  "content": {    "contentExample": {      "nodeType": "translation",      "translation": {        "fr": "Ceci est un exemple de contenu",        "es": "Este es un ejemplo de contenido",      },    },  },}

之后，这两个声明文件将合并为一个字典，可以通过标准的 useIntlayer("example") 钩子（React）或组合函数（Vue）访问。

自动填充文件格式

推荐的自动填充声明文件格式是 JSON，这有助于避免格式限制。然而，Intlayer 也支持 .ts、.js、.mjs、.cjs 及其他格式。

src/components/example/example.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: "./example.filled.content.ts",  content: {    // 你的内容  },};

const exampleContent = {  key: "example",  autoFill: "./example.filled.content.ts",  content: {    // 你的内容  },};

这将生成文件于：

plaintext

复制代码

复制代码到剪贴板

src/components/example/example.filled.content.ts

src/components/example/example.filled.content.ts

.js、.ts 及类似文件的生成方式如下：

如果文件已存在，Intlayer 将使用 AST（抽象语法树）解析文件，定位每个字段并插入任何缺失的翻译。
如果文件不存在，Intlayer 将使用默认的内容声明文件模板生成它。

绝对路径

autoFill 字段也支持绝对路径。

src/components/example/example.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: "/messages/example.content.json",  content: {    // 你的内容  },};

const exampleContent = {  key: "example",  autoFill: "/messages/example.content.json",  content: {    // 你的内容  },};

这将生成文件于：

plaintext

复制代码

复制代码到剪贴板

/messages/example.content.json

/messages/example.content.json

自动生成每个语言环境的内容声明文件

autoFill 字段还支持生成每个语言环境的内容声明文件。

src/components/example/example.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: {    fr: "./example.fr.content.json",    es: "./example.es.content.json",  },  content: {    // 您的内容  },};

const exampleContent = {  key: "example",  autoFill: {    fr: "./example.fr.content.json",    es: "./example.es.content.json",  },  content: {    // 您的内容  },};

这将生成两个独立的文件：

src/components/example/example.fr.content.json
src/components/example/example.es.content.json

在这种情况下，如果对象不包含所有语言，Intlayer 将跳过剩余语言的生成。

过滤特定语言的自动填充

为 autoFill 字段使用对象可以让您应用过滤器，只生成特定语言的文件。

src/components/example/example.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: {    fr: "./example.fr.content.json",  },  content: {    // 您的内容  },};

const exampleContent = {  key: "example",  autoFill: {    fr: "./example.fr.content.json",  },  content: {    // 您的内容  },};

这将只生成法语翻译文件。

路径变量

您可以在 autoFill 路径中使用变量，以动态解析生成文件的目标路径。

可用变量：

{{locale}} – 语言代码（例如 fr，es）
{{fileName}} – 文件名（例如 index）
{{key}} – 字典键（例如 example）

src/components/example/index.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: "/messages/{{locale}}/{{key}}.content.json",  content: {    // 您的内容  },};

const exampleContent = {  key: "example",  autoFill: "/messages/{{locale}}/{{key}}.content.json",  content: {    // 您的内容  },};

这将生成：

/messages/fr/example.content.json
/messages/es/example.content.json

src/components/example/index.content.ts

复制代码

复制代码到剪贴板

const exampleContent = {  key: "example",  autoFill: "./{{fileName}}.content.json",  content: {    // 您的内容  },};

const exampleContent = {  key: "example",  autoFill: "./{{fileName}}.content.json",  content: {    // 您的内容  },};

这将生成：

./index.content.json
./index.content.json

编译器

测试