我正在使用 vue、vuei18n 和 Storybook,但我在翻译显示方面遇到问题。
storybook 使用我的自定义 webpack 配置加载得很好。翻译通过 .json 文件存储在每个组件的 i18n 标记中。
我正在使用以下 webpack 配置规则:
test: /\.scss$/,
loaders: ["style-loader", "css-loader", "sass-loader"],
include: path.resolve(__dirname, "../"),
}, {
test: /\.html$/,
loaders: ["html-loader"],
include: path.resolve(__dirname, "../"),
}, {
resourceQuery: /blockType=i18n/,
type: "javascript/auto",
loader: "@kazupon/vue-i18n-loader",
});
故事通常是这样加载的:
storiesOf("MyComponent", module)
.add("MyComponent opened", () => ({
components: { MyComponent },
template: '<v-app><my-component></my-component></v-app>',
i18n,
store,
created() {
store.dispatch("myComponent/openWith", null);
},
}))
我还在使用 vue-loader 15.7.1、storybook 5.2.1。
当组件加载时,我在浏览器控制台上收到以下警告:
[vue-i18n] Cannot translate the value of keypath 'translation.value'. Use the value of keypath as default
这是因为 $i18n.locale 设置为“en-US”,尽管我已在故事加载时对其进行了定义。如果我插入一个将语言环境设置为“en”的created()方法,则翻译工作正常。为什么会发生这种情况?
最佳答案
错误消息是“无法翻译 keypath translation.value
的值”。因此,您可能需要在 i18n 实例中声明 translation.value
。
喜欢:
i18n: new VueI18n({
locale: 'en',
messages: {
en: {
transition: {
value: 'value'
}
}
}
关于vue.js - vue-i18n + 故事书 - 为什么我的翻译不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58249601/