我在插件gulp-static-i18n-html中使用gulp，但是我遇到了插值链接的问题。常规数据属性可以正常工作。
电流输入
<a data-attr-t data-attr-t-interpolate href-t="{{link-prefix}}page.html" data-t="header.title">
</a>
en.json
{
"link-prefix": "/fr/",
"header": {
"title": "Home"
}
}
电流输出
<a href="page.html">Home</a>
预期产出
<a href="/fr/page.html">Home</a>
TLDR
此问题可能是由于您使用panini或其他插件使用与gulp-static-i18n-html相同的语法进行插值({{}})，请确保每个库的语法不同，并且应该运行良好。
问题的细节突破
在我的 gulp 构建过程中，我使用了一个名为panini的插件。此插件 使用通用布局编译一系列 HTML 页面，并使用特殊语法。
例：
<!-- Header up here -->
{{> body}}
<!-- Footer down here -->
如果您注意到，此语法的前缀和后缀与gulp-static-i18n-html用于插值的前缀和后缀完全相同。由于这个插件首先运行，这就是插值不起作用的原因。 此时的解决方案很简单，覆盖其中一个插件的默认后缀和前缀并使它们不同。
由于 panini 是为整个项目设置的，因此覆盖默认前缀会很痛苦，所以我决定覆盖另一个插件。
要记住的一件事gulp-static-i18n-html建立在使用i18next进行翻译的static-i18n之上。我在文档中注意到该库有一个将配置传递给i18next的选项，这意味着如果我传递这个，我可以覆盖默认的后缀和前缀
staticI18nHtml({
...
i18n: {
interpolation: {
prefix: "%{",
suffix: "}",
}
}
})
尝试了这个之后，我意识到了另一个问题。这不起作用，插值模板保持不变。
一旦我意识到这一点，我决定深入研究库及其依赖项的源代码。
gulp-static-i18n-html把所有的选择都交给了static-i18n，把他们交给了i18next，这很好。但后来我意识到属性的实际插值是由static-i18n完成的，他们没有使用这些选项，而是在用于替换属性字符串的正则表达式字符串中对前缀和后缀进行硬编码。
意识到这一点后，我将库固定在本地分支中，我将改用它。