Allow loading of translations from packages

markbrockhoff commented 4 days ago

Describe the feature

Hi,

first of all thanks for creating and maintaining this amazing nuxt module. ❤️

Context

I'm currently working on a nuxt module for a component library that ships with default translations. I integrated this module to automatically handle all the translations by registering the component libraries translations under a scope, so it's easy to extend and overwrite them. All of this works great with just the one exception that all locales of the module will now show up inside the project using it.

For example: If the component library registers the languages en-US and de-DE but the project only defines en-US, de-DE will still be shown as a locale. All of this could be simplified by just importing the translations for the component library inside the project manually.

Proposed feature

Allow using node modules inside the files property of a locale

The feature could look something like this:

export default defineNuxtConfig({
  modules: [
    '@sit-onyx/nuxt',
    '@nuxtjs/i18n',
  ],
  i18n: {
    defaultLocale: 'de-DE',
    locales: [
      { code: 'de-DE', iso: 'de-DE', name: 'Deutsch', files: [{ path: '@sit-onyx/nuxt/locales/de-DE.json', external: true }, 'de-DE.json'] },
      { code: 'en-US', iso: 'en-US', name: 'English', files: [{ path: '@sit-onyx/nuxt/locales/en-US.json', external: true, scope: 'onyx' }, 'en_US.json']  },
    ],
    langDir: 'i18n',
    lazy: true,
  },
});

By adding a property external to the LocalFile type it would be possible to ignore the langDir and load it from node_modules instead. Optionally a second property scope could be useful to scope the imported messages to avoid conflicts between the different files. Like in the example for the locale "en-US" where the messages for the component library would later be accessible under the key "onyx.*".

Additional information

[x] Would you be willing to help implement this feature?
[ ] Could this feature be implemented as a module?

Final checks

[X] Read the contribution guide (The contribution guideline of nuxt-modules/i18n is compliant with Nuxt too).
[X] Check existing discussions and issues.

markbrockhoff commented 3 days ago

Sorry if I'm being a bit hasty here, but I already created a minimal PR (#3003) implementing the proposed feature for loading translation files from npm packages. Please let me know what you think @kazupon :)

kazupon commented 3 days ago

Thank you for your feedback and pull-requesting! ❤️

I like your idea as it makes it easy to load locals. As you can see in the URL below, nuxt-i18n v9 is considering reviewing or improving locales configuration. https://github.com/nuxt-modules/i18n/issues/3002

locales conifguration also depends on nuxt layers, so we need to take that into account. This feature needs to be considered, together @BobbieGoede

I have considered lightly for alternatives. I think that loading a locale from a package can be done by specifying it in path so that its package path can be resolved in nuxt.config.

markbrockhoff commented 3 days ago

Thanks for the quick feedback! 👍

I agree, getting rid of the langDir would make things easier as all files could be resolved from the base of the project, including npm packages.

So if I got that right for v9 you'd imagine something like this?

export default defineNuxtConfig({
  i18n: {
    lazy: true,
    defaultLocale: 'en'
    locales: [
      {
        code: 'en',
        name: 'English',
        files: ['my-module/locales/en.json', './i18n/locales/en.json']
      }
    ],
  }
})

I like the idea but would it be possible to add this feature as non breaking within v8 already? From the checkboxes inside the roadmap it looks like v9 could still take a moment but at least to me this feature would already be pretty useful right now. :)

nuxt-modules / i18n