我想要实现的是我可以为所有组件本身提供翻译。当我安装这些组件时,它们应该自行渲染。我想要实现的另一件事是我的项目可以推翻组件级别的翻译。如果有人认为那里的翻译不是我们想要的,那就是这种情况。
我在我的组件中所做的是加载i18n
:
import i18n from 'i18next';
import XHR from 'i18next-xhr-backend';
import Cache from 'i18next-localstorage-cache';
import LanguageDetector from 'i18next-browser-languagedetector';
i18n
.use(XHR)
.use(Cache)
.use(LanguageDetector)
.init({
backend: {
loadPath: '../dist/locales/{{lng}}/{{ns}}.json',
},
fallbackLng: 'en',
react: {
wait: true
},
ns: ['authentication'],
defaultNS: 'authentication',
debug: false,
cache: {
enabled: true
},
interpolation: {
escapeValue: false, // not needed for react!!
formatSeparator: ',',
format: function(value, format) {
if (format === 'uppercase') return value.toUpperCase();
return value;
}
}
});
export default i18n;
这在我的故事书中工作得很好但是当我在我的主项目中加载它时,它正在使用我的构建根目录中的../
,这实际上不是组件本身,而是我的主要实现项目。
我如何解决它,我怎样才能确保我甚至可以解决这个问题?
更新: 下面列出了当前文件夹结构,如下面问题所示:
#Component
dist
--.gitkeep
--locales
--commonjs
--es
src
--actions
----index.js
--components
----compname
------index.js
--reducers
----foo.js
--i18n.js
--index.js
test
.babelrc
package.json
Jenkinsfile
#Project
react
--assets
----css
------app.scss
--dist
----.gitkeep
--src
----index.js
----store.js
webpack.config.js
由于