vue-i18n + storybook - Почему мои переводы не работают? - PullRequest
Новая
       36

vue-i18n + storybook - Почему мои переводы не работают?

3 голосов
/ 05 октября 2019

Я использую vue, vuei18n и storybook, но у меня проблемы с показом переводов.

сборник рассказов прекрасно загружается с моей пользовательской конфигурацией webpack. переводы хранятся в тегах i18n каждого компонента через файл .json.

я использую следующие правила конфигурации веб-пакетов: 

        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, сборник рассказов 5.2.1.

Когда загружаются компоненты, на консоли браузера появляется следующее предупреждение: 

[vue-i18n] Cannot translate the value of keypath 'translation.value'. Use the value of keypath as default

Это потому, что для $ i18n.locale установлено значение "en-US", хотя я определил это в истории, как она загружается. Если я вставляю метод create (), который устанавливает "en" для локали, переводы работают нормально. Почему это происходит?

1 Ответ

0 голосов
/ 01 ноября 2019

Сообщение об ошибке: «Невозможно перевести значение keypath translation.value». Поэтому, возможно, вам нужно объявить translation.value в вашем экземпляре i18n. как: 

i18n: new VueI18n({
  locale: 'en',
  messages: {
    en: {
      transition: {
        value: 'value'
      }
  }
}
...