Configurations

Default state

The plugin comes with few configurable parameters which live in the default state of the store module.

These are all available parameters and default values:

{
    persistent: true,
    storageKey: 'language_key',
    path: 'static/i18n',
    defaultCode: 'en-GB',
    languageFilter: [],
    translations: {},
    languages: [
        {
            code: 'en-GB',
            urlPrefix: 'en',
            translationKey: 'en-GB'
        }
    ]
}

Add languages

Add a new language is really easy: the only mandatory fields you need to pass in the object are code, translationKey and urlPrefix, the rest of the object can contain every kind of informations you want to save for each language: for example a name or a specific date format.

Make sure to specify a defaultCode property if the default language of the application is not English.

Check how to add translations

const config = {
    defaultCode: 'it-IT',
    languages: [
        {
            name: 'English',
            code: 'en-GB',
            urlPrefix: 'en',
            translationKey: 'en'
        },
        {
            name: 'Italiano',
            code: 'it-IT',
            urlPrefix: 'it',
            translationKey: 'it-IT'
        }
    ]
}

Vue.use(VueI18nManager, { store, config })

Add translations

Add a translations object in the configuration with the new key, which needs to match the translationKey, and your translations.

The object also accept nested elements.

const config = {
    ...
    languages: [
        {
            code: 'en-GB',
            translationKey: 'en',
            urlPrefix: 'en'
        }
    ],
    translations: {
        'en': {
            section: 'News',
            article: {
                title: 'Dolor sit',
                content: 'Lorem ipsum dolor sit amet'
            }
        }
    }
}

Vue.use(VueI18nManager, { store, config })

*For a more complex way to retrieve translations, please check the proxy chapter