i18next翻译不会在EJS中呈现
i18next是一个用于前端国际化（Internationalization，简称i18n）的工具库。它可以帮助开发者在网页应用中实现多语言支持，使得网站能够根据用户的语言偏好来展示相应的内容。在EJS（Embedded JavaScript Templates）中使用i18next进行翻译时，可能会遇到翻译不会呈现的问题。
解决这个问题的方法有多种，下面列举其中几种常用的方法：
- 确保正确配置：首先，需要确认i18next的初始化和配置是否正确。确保已经加载了i18next库，配置了语言资源文件以及语言切换的逻辑。可以通过检查相关代码和配置文件，特别是检查语言资源文件路径是否正确和是否包含了需要翻译的文本。
- 检查语言标识：在使用i18next时，需要根据用户的语言偏好来选择合适的语言资源进行翻译。需要确保使用的语言标识和语言资源文件中定义的标识一致。例如，使用"en-US"作为语言标识时，需要在语言资源文件中存在对应的翻译。
- 检查文本翻译：确认待翻译的文本是否在语言资源文件中有对应的翻译。可以通过查看语言资源文件中的键值对来确认是否存在对应的翻译内容。
- 调试工具：使用i18next提供的调试工具来帮助排查问题。i18next提供了一些方便的工具和插件，可以在开发者工具中查看翻译的状态和相关信息，以帮助找出问题所在。
推荐的腾讯云相关产品和产品介绍链接地址如下：
以上是解决i18next翻译不会在EJS中呈现的一些建议和相关腾讯云产品信息，希望对你有帮助。
相关·内容
2回答
当我使用i18next进行翻译时，我得到了错误Unexpected token ) while compiling ejs。 我已经使用i18next实现了转换，下面是以下代码，在使用map函数时得到以下错误 en.json
{
"title": "List of Countries",
"list":[{
"name": "Singapore",
"code": "SG"
},{
"name": "Thailand
浏览 27提问于2019-06-16得票数 0
我是node.js新手，我想国际化我的应用程序。我从和的模板开始。我希望用户单击该按钮，让服务器获取.json文件并将翻译服务返回给用户。下面是我的代码：
<script src="https://unpkg.com/i18next/i18next.js"></script>
<div style="height: 100px">
<button onclick="i18next.changeLanguage('en')">
english
</button>
浏览 1提问于2017-08-22得票数 1
回答已采纳
我是i18next的新手，我不太明白为什么有必要在玩react时使用react i18Next。
在我的组件中使用像moment.js这样的外部库，我需要：const date = moment(this.state.date)
我可以用i18next做下面这样的事情吗？
import i18next from 'i18next';
const translated = () => (
<h1>{i18next.t('title')}</h1>
)
谢谢
浏览 2提问于2017-11-15得票数 3
回答已采纳
我在i18next服务器端安装了Node.js。在客户端javascript文件中使用i18next.t()的最佳实践是什么？我已经设置了Express来呈现服务器端变量，以便在.ejs文件中使用。但是，我不能将它们传输到在ejs中导入的js文件。
我想过的一些可能的方法：
导出和加载服务器中初始化到客户端的i18next。我知道用于ejs的<%= %>变量在内联脚本中工作。但是，为了内容安全策略，我避免使用它们。也许有一种方法可以将其发送到js文件？Load并再次在客户端初始化i18next。我尝试过这样做，但是服务器和客户端都有重复的区域设置文件。通过指定路径导出区域设置文件。
浏览 4提问于2022-05-06得票数 0
1回答
我有一页使用Next和ReactiveI18Next的英文和法文。
现在的问题是，如果我把语言设置为Frn和刷新，它仍然显示英语内容。
我发现了两种连线的东西：
如果我删除的内容，即getServersideProps，法语翻译就会出现。任何会触发组件重呈现的内容都会更新翻译。(如果一个孩子被重新呈现，孩子就会有frn，但所有的父母仍然用英语)。
代码：
pages/.../indexs.tsx
export const getServerSideProps: GetServerSideProps = async ({ req }) => {
// async requests
浏览 10提问于2022-09-07得票数 0
1回答
我正在处理一个React项目，我从i18nexus中添加了国际化，并且我试图在一个普通的JS文件中使用这个转换。
index.js `
import React, { Suspense } from "react";
import { BrowserRouter } from "react-router-dom";
import ReactDOM from "react-dom/client";
import "./index.css";
import App from "./App";
import report
浏览 12提问于2022-11-16得票数 0
我查看了说明，他们共享了
import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';
import Backend from 'i18next-http-backend';
import LanguageDetector from 'i18next-browser-languagedetector';
// not like to use this?
// have a look at the Quick start guide
/
浏览 36提问于2020-07-30得票数 0
我已经反应了应用程序和有许多组件，我希望文本将支持多种语言，我的意思是，如果用户想要英语，那么所有的内容翻译成英语。
我尝试使用i18next库在自己的react应用程序中添加多语言，但我发现我需要用每种语言编写所有文本，并存储在某个地方，然后使用它。
但是，当用户选择语言时，我想要它，然后它在没有硬代码的情况下翻译成所需的语言。
就像我们在google翻译器中写任何东西一样，它用所需的语言翻译所有的页面。
浏览 10提问于2022-11-05得票数 -1
1回答
我试图在我的应用程序中添加翻译，但我无法找到使i18next工作的方法。
这里是i18n.ts
import i18n from "i18next";
import { initReactI18next } from "react-i18next";
import * as en from './i18n/en.json';
import * as jp from './i18n/jp.json';
i18n
.use(initReactI18next)
.init({
resources: {
en
浏览 1提问于2019-10-29得票数 1
回答已采纳
1回答
我的路径中有英文json翻译文件:笔译/en.json
我猜i18next是这样的：
i18next.init({
lng: navigator.language,
fallbackLng : "en",
backend: {
loadPath: '/translation/{{lng}}.json',
}
});
跑后
i18next.t(KEY);
将在翻译文件中打印"KEY“而不是其值。
当翻译在i18next对象中的资源参数中时，它工作得很好。如下所示：
i18next.init({
lng
浏览 0提问于2018-09-27得票数 5
回答已采纳
1回答
我正在翻译一个react项目，所以我使用了i18next。
到目前为止，我还没有遇到任何问题，遵循文档的所有工作，只是我要进入一个更困难的主题，我想有html代码(非常简单)在我的翻译，为布局。
只是，
标签显示为文本，在html中没有考虑到，这是我不明白的，如果我读好了文档，它们应该是.
你有解决办法吗？
下面是我的i18n.js配置：
import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';
import Backend from 'i18next-h
浏览 5提问于2020-06-19得票数 2
回答已采纳
我有一个方法可以呈现EJS模板，并通过将i18next t函数设置为数据对象的属性来传递i18next.t函数，以便EJS模板进行转换： const data = {
email: user.email,
id: user.id,
t: i18nT
}; 数据对象被传递给ejs.renderFile()。让EJS模板中的翻译正常工作的唯一方法是，从i18next.init()函数回调中将i18nT变量设置为t函数。否则它将显示为空白。我从控制台输出中看到，i18next实例
浏览 38提问于2020-12-17得票数 1
这是我第一次使用i18next，我不知道如何使它工作。(在我看来，是不完整的)这是我的i18next代码
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/i18next/4.0.0/i18next.min.js" ></
浏览 6提问于2017-03-02得票数 6
回答已采纳
1回答
我发现这篇好的、简单的文章用于在RN中实现本地化(在世博会中)。
我的用例有点不同:我的应用程序有一系列需要翻译的术语( js对象为每种语言约1MB，乘以6-7种语言)。
这个应用程序完全离线(没有机会从服务器加载地区文件)，所以我正在寻找最好的懒惰方式-加载我想要的json/js区域设置对象。
我是来听取RN/i18next专家的建议的。
编辑：-我几乎复制了这个的i18n配置
真正的数据库在字段data:DB中。Obiouvsly --这不是加载重文件的最佳方式，我总是加载所有languages..can的所有DB --我在某种程度上保持了相同的简单结构，但是延迟加载只是我需要的语言？否则
浏览 1提问于2018-05-06得票数 0
回答已采纳
1回答
我在尝试使用i18next on reactive 进行反应性转换时遇到了问题。
这些是重要的档案：
i18n/index.js
import i18next from 'i18next';
import en from './en.json';
import es from './es.json';
import it from './it.json';
const i18n = i18next.init({
interpolation: {
// React already does escaping
浏览 0提问于2018-06-22得票数 0
回答已采纳
我试图将i18next与世博一起使用，并使用多个翻译文件，但我始终收到以下错误：
i18next::translator: missingKey en Common NextSteps NextSteps
i18next::backendConnector: loading namespace Common for language en failed, [TypeError: Network request failed]
我的配置文件是：
import i18n from 'i18next';
import Backend from 'i18next-http-
浏览 12提问于2022-03-21得票数 1
我对webpack生态系统非常陌生，所以我没有掌握它的所有概念，但我正在开发一个使用它的应用程序。我正在尝试设置i18next (参见：)及其与XHR相关的模块()。
i18next通过XHR获取翻译文件，因此当AJAX请求完成时，会在提供的回调中初始化i18next。基本上，我希望这个初始化的i18next可以在我的所有模块中使用，这样我就可以在任何地方转换字符串。
在i18next-xhr-backend的github页面上有一个关于webpack的部分，但我真的不知道如何构造代码以及如何使用它。
function loadLocales(url, options, callback, d
浏览 0提问于2017-04-13得票数 0
我什么也不懂了。
我使用i18next并希望访问我的密钥，但它不起作用。
i18next::translator: missingKey de translation profile profile
i18next::translator: missingKey de translation profile profile
i18next::translator: missingKey de translation profile profile
这是我的translation.json
{
"app_name": "Test (NEW DE)",
&#
浏览 1提问于2022-03-27得票数 2
2回答
我使用了React应用程序-i18Next，翻译存储在两个位置。其中一组是本地存储到应用程序的文件夹中，其余的翻译来自远程API。
我正在努力让这两个设置加载到应用程序中。使用i18Next链式后端插件，它似乎只在第一个后端不加载翻译时才提供回退，我似乎无法将其配置为加载这两组翻译。
在一个基于反应的应用程序中包含多个来源的翻译的最佳方法是什么？
浏览 0提问于2019-02-26得票数 6
1回答
为什么我不能动态翻译。在i18next中使用变量？
例如，在我的JS文件中，我得到了以下内容：
在这里，我使用一个变量并将它赋值给i18n函数，但是它没有工作：
//this does not work:
var dynamicTranslation = "myText.toBetranslated";
console.log("translation dynamic ", !{JSON.stringify(t(dynamicTranslation))});
在这里，我直接将上面的字符串硬编码到i18n函数中，它确实工作了：
//inserted str
浏览 5提问于2016-10-17得票数 2
回答已采纳
虽然ngx-i18next是i18next的包装器，但我特别想知道ngx-translate和i18next在翻译方面的区别。
浏览 2提问于2017-10-20得票数 1
我有一个用React & support hooks写的项目。我正在尝试使用react i18Next来支持翻译。一切都很好，因为我已经遵循了文档。
但是，当我想在帮助器/非组件的t()文件上使用.js函数时，我遇到了一些问题。然后，我通过直接从init文件i18n导入./i18n.ts来解决这个问题，该文件如下所示
import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';
i18n
.use(initReactI18next)
.init({
浏览 2提问于2020-09-07得票数 6
我的场景是一个Node.js + Express +Handlebar+ i18next应用程序。
我想在数据库配置键上设置默认语言。如果我决定默认语言应该是X而不是Y，我会简单地更改它，并将该选择保存在我的应用程序的后端。问题是，我不想每次更改默认语言时都重新加载整个应用程序，所以我不能在i18next.init()方法中这样做。应该在每个页面请求时从数据库中读取默认语言，如果当前用户没有执行其他选择，则使用默认语言。我的想法如下，但行不通：
const express = require('express');
const i18next = require('i1
浏览 0提问于2020-05-30得票数 0
我正试图在我的网站上实现i18next翻译，但无法获得成功。
i18next.init({
debug: true,
lng: 'en',
resources: {
en: {
translation: {
opt: {
page_title: 'Orders'
},
}
},
ru: {
translation: {
浏览 0提问于2017-09-12得票数 0
1回答
是否有可能禁用SAP Spartacus I18next模块，以便使用我自己的翻译模块/策略？我正在尝试使用我自己的带有翻译的共享模块，但它是基于i18next库的，就像inspartacus/core一样，看起来它们是冲突的，因为它们分开工作很好。
浏览 11提问于2020-03-19得票数 1
我想使用i18next来本地化我当前的项目。因为它是基于expressjs的，所以也使用i18next-express-i18next才有意义。
对于这个项目非常重要的是，有搜索引擎优化的原因本地化的路线。这就是我想用中间件来管理的东西。
不幸的是，关于这个主题的文档似乎很少：
我指出以下函数对于设置本地化路由(从文档中)是必不可少的：
i18nextMiddleware.addRoute(i18next, '/:welcome', ['welcome', 'willkommen'], route, 'get', function
浏览 5提问于2017-03-04得票数 0
1回答
我有以下代码。
import i18next from 'i18next';
import React from 'react';
const LanguageDetector = require('i18next-browser-languagedetector');
const initReactI18next = require('react-i18next');
import { TRANSLATIONS_EN } from '../public/locales/en/en.js';
i18next
浏览 7提问于2022-01-21得票数 0
</head>
<body>
<div id="add">
<div data-i18n="key">You have to <a href="">Click here</a> to find better result</div>
//如果我使用这种方式，可以翻译完整的div并从文本中删除链接。
<div data-i18n="key">You have to</div> <a h
浏览 5提问于2017-05-24得票数 0
回答已采纳
关于aria属性翻译的最佳实践是什么？如果一个页面有几种语言可用，那么属性也应该是咏叹调吗？
我正在使用react i18Next useTranslation钩子将一个站点翻译成几种不同的语言，我想知道我是否也应该使用这个钩子来翻译我的aria属性。
浏览 14提问于2022-07-29得票数 2
我正在使用i18next翻译我的NextJs应用程序。翻译在我的浏览器中加载非常好，但在我的控制台中仍然很少看到错误。
i18next: hasLoadedNamespace: i18next was not initialized undefined
i18next::translator: key "resources.welcome_string.value" for languages "en-US" won't get resolved as namespace "myStrings" was not yet loaded Th
浏览 15提问于2021-05-14得票数 3
我刚刚开始在我的react应用程序上使用i18next包，但我遇到了一个问题。我做了‘纱添加i18next@7.1.3 -保存’来安装软件包。然后在我的部分我做了这个：
import i18next from 'i18next'
// other imports...
// defining class
constructor(props){
super(props)
console.log(i18next.t('Wähle einen Titel für deinen Ratgeber'))
}
在渲染方法中，我要这样做
<Explainer
浏览 1提问于2017-06-06得票数 1
我想在httpbackend中使用i18next，但我现在的问题是为什么每个人都为此使用后端?为什么我不能在react文件夹中创建一个公用文件夹，然后从那里加载它呢？
浏览 12提问于2022-03-20得票数 0
1回答
我在组件回购中使用i18next。组件工作正常，但我在测试方面有问题。我将i18next与hoc一起使用，当我只导出组件时，测试就会通过，但是当我导出它时，就像导出默认翻译('components') (列表)一样；测试失败。我试着做两个导出，使用hoc和不带，但是在另一个中使用了一些组件，如果没有hoc，我就无法导入它。我的架构看起来像:使用I18nextProvider的根组件，我已经用这个组件包装了每个组件，它是我的主应用程序中的主要组件。就像这样：
const Root = ({ component, i18 }) => (
<I18nextProvid
浏览 3提问于2018-02-18得票数 1
在我的translations.ts代码文件中，我有：
import i18next from 'i18next';
import Backend from 'i18next-node-fs-backend';
import path from 'path';
i18next.use(Backend).init({
lng: "en",
fallbackLng: "en",
backend: {
loadPath: path.join(__dirname, '/tr
浏览 0提问于2020-03-25得票数 0
3回答
i18next最佳实践
、、、、
我已经成功地实现了i18next，顺便说一下，它是一个很棒的库！尽管我还在寻找“最佳实践”。这是我现在的设置，总体上我喜欢：
var userLanguage = 'en'; // set at runtime
i18n.init({
lng : userLanguage,
shortcutFunction : 'defaultValue',
fallbackLng : false,
load : 'unspecific',
浏览 2提问于2014-10-25得票数 6
我正在使用I18next来管理我的翻译。在过去，我们只有两个字符的语言子网站，如en，nl，de等。现在，我们正在添加一个新的网站名为be-nl和be-fr，比利时法语和比利时荷兰语。
我现在面临的问题是，i18next无法找到-的翻译。这些是我传递给i18next.init选项的资源
resources: {
'be-fr': be_fr,
'be-nl': be_nl,
asia, cn, en, id, ng, nl
}
其中be_fr和be_nl是保存整个子站点的转换对象的
浏览 7提问于2022-06-28得票数 0
回答已采纳
2回答
我已经构建了一个react应用程序-i18Next，用于本地化。但是当我用它作为另一个应用程序的微前端时，它并不是翻译文本和返回json键。我是否也需要对父/主机应用程序使用i18next本地化，还是有其他方法解决这个问题？
浏览 10提问于2022-03-24得票数 0
1回答
我不想在json文件中使用转换密钥。我希望文件只有两个级别，我的意思是我不想在每个语言环境文件中都包含翻译键：
{
"translation": {
"sidebar": {
"dashboard": "Dashboard",
"clients": "Clients",
"coaches": "Coaches",
"candidates": "Candidates",
浏览 1提问于2017-11-14得票数 0
1回答
如何初始化i18next
、、、
我想通过i18next包创建一个多语言应用程序
但是包不能正常工作。
这是i18next文件
import i18n from "i18next";
import Backend from "i18next-xhr-backend";
import LanguageDetector from "i18next-browser-languagedetector";
import { initReactI18next } from "react-i18next";
const fallbackLng = ["en"];
浏览 2提问于2021-04-05得票数 1
回答已采纳
3回答
我在一个项目中使用，无法在翻译文件中包含html标记，也无法正确地呈现它们。
我的.json转换文件的一个示例：
"en": {
"product": {
"header": "Welcome, <strong>User!</strong>"
}
}
有一个与JQuery相关的。我没有使用JQuery，我的项目是React，下面是我的设置：
import i18next from 'i18next';
import en from 'locales/en';
浏览 2提问于2016-10-04得票数 14
4回答
我已经在public folder中保存了文件，以便针对不同的language ( translation )进行反应。现在，我有了从API获取数据的要求。我能够调用API并获取数据。我还知道如何使用translation。但我无法将API调用合并到翻译代码文件中。
API接口。
axios
.get(
'http://localhost:8080/file_download/' +
navigator.lnaguage
)
.then((res) => {
console.log(
浏览 15提问于2022-01-05得票数 1
回答已采纳
2回答
我正在使用i18next通过typescript来国际化我的React web应用程序。当我处理文本时，它输出以下内容：
Running string extraction on source files
Finding source files to process
Running xgettext
Extracting text for language en
Translation file was found - merging translations
..............................
Read 1 old + 1 reference, merged 26
浏览 0提问于2018-07-13得票数 1
我正在检查我们是否可以在我们的项目中使用i18next。
我发现了jQuery UI工具提示的一个问题: jQuery UI从标题属性获取工具提示内容，而i18next使用data-i18n属性本地化元素内容。
有处理jQuery UI对话框/按钮的链接，我们是否必须做类似的事情，或者有其他选择？
浏览 0提问于2013-09-10得票数 0
1回答
每次我尝试翻译时，我都会得到i18next::translator: missingKey es-AR，这是我的component.pug
.headersGroup
h2(ng-i18next="{{$ctrl.getFilterTitle()}}")
h3(ng-i18next="landing.name")
我试着用两种方式翻译。从帕格文件和控制器。
component.js
getFilterTitle () {
return this.$i18next.t('landing.
浏览 0提问于2017-12-19得票数 0
我正在使用ExpressJS和i18next。
在app.js中
var express = require('express')
, i18n = require('i18next')
, user = require('./routes/user')
...
//internationalization
i18n.init({
lng: 'en-US',
saveMissing: true,
debug: true
});
...
app.use(i18n.handle);
app.set('v
浏览 0提问于2013-06-21得票数 4
我一直在使用i18next，然后我试着为一些翻译后的字符串做一些后备的值，这些值将在另一种语言中出现，每个例子：
en:
base.json
"yes":"yes"
"no": "no"
fr:
base.json
"yes": "oui"
"no: ""
所以我想要的预期行为是，当vue在FR上运行时，当我尝试执行{{ i18n.t('base:no' }}时，输出应该是no，而不是空字符串。
这是我到目前为止尝试
浏览 0提问于2018-04-05得票数 2
我跟踪了这篇文章：。
现在，我想知道是否有方法将参数传递到从.json文件中提取的字符串中。
public/locales/en/transation.json
{
"GREETING": "Hello ${name}, nice to see you."
}
src/i18n.ts
import i18n from 'i18next';
import {initReactI18next} from 'react-i18next';
import LanguageDetector from 'i18next-brows
浏览 6提问于2022-05-09得票数 1
回答已采纳
1回答
我已经将i18next包含在我的Express应用程序中，并按如下方式配置它： const i18next = require('i18next');
const Backend = require('i18next-fs-backend');
const i18nextMiddleware = require('i18next-http-middleware');
i18next
.use(Backend)
.use(i18nextMiddleware.LanguageDetector)
.init({
浏览 32提问于2021-10-13得票数 1
回答已采纳
我使用作为基础。我用自定义语言检测器替换了'i18next-browser-languagedetector‘：
class MyLanguageDetector {
constructor(services, options = {}) {
this.async = true;
this.init(services, options);
}
init(services, options = {}, i18nOptions = {}) { }
detect(callback) {
setTimeout(() => {
ca
浏览 10提问于2018-12-15得票数 1
回答已采纳
2回答
我目前正在尝试使用react i18Next用于以下用例:一个为不同公司构建并针对用户公司的应用程序。用户的公司名称不同，但他们将重用相同的UI组件。翻译对象将如下所示：
{
"companyX": {
"homeFeature": {
"title": "Sint est in mollit ",
"description": "Incididunt quis mollit id excepteur amet ipsum."
}
},
"
浏览 17提问于2022-10-16得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
