Number localization

Support Version

🆕 7.0+

You can localize the number with your definition formats.

Number formats the below:

const numberFormats = {
  'en-US': {
    currency: {
      style: 'currency', currency: 'USD'
  'ja-JP': {
    currency: {
      style: 'currency', currency: 'JPY', currencyDisplay: 'symbol'

As the Above, You can define the number format with named (e.g. currency, etc), and you need to use the options with ECMA-402 Intl.NumberFormat

After that like the locale messages, You need to specify the numberFormats option of VueI18n constructor:

const i18n = new VueI18n({

new Vue({

Template the below:

<div id="app">
  <p>{{ $n(100, 'currency') }}</p>
  <p>{{ $n(100, 'currency', 'ja-JP') }}</p>

Output the below:

<div id="app">
Last Updated: 11/18/2018, 11:29:54 PM