Skip to content
This repository was archived by the owner on Dec 31, 2024. It is now read-only.
This repository was archived by the owner on Dec 31, 2024. It is now read-only.

Cannot format number when Intl polyfill is dynamically loaded #477

Description

@gamtiq

vue & vue-i18n version

vue - 2.5.17
vue-i18n - 8.3.2

What is actually happening?

When browser does not support Intl API (for example, Opera 12 or browser on an old Smart TV) and Intl.js polyfill is dynamically loaded via webpack's require.ensure, vue-i18n does not format numbers because value for VueI18n.availabilities is determined once upon loading of vue-i18n which is included in vendors chunk and loaded before application code where the polyfill is requested. As a result VueI18n.availabilities.dateTimeFormat and VueI18n.availabilities.numberFormat are set to false and _n method always returns empty string.

A possible fix is to define getter for VueI18n.availabilities:

let availabilities;
Object.defineProperty(VueI18n, 'availabilities', {
    get: function get() {
        return availabilities || (availabilities = {
            dateTimeFormat: typeof Intl !== 'undefined' && typeof Intl.DateTimeFormat !== 'undefined',
            numberFormat: typeof Intl !== 'undefined' && typeof Intl.NumberFormat !== 'undefined'
        });
    }
});

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions