fix(lazy): only process lang files with js, ts and json extensions (#…

…1070)

Resolves #1068

docs/content/en/lazy-load-translations.md

@@ -5,15 +5,15 @@ position: 9
 category: Guide
 ---
 
-For app's that contain a lot of translated content, it is preferable not to bundle all the messages in the main bundle but rather lazy-load only the language that the users selected.
+For apps that contain a lot of translated content, it is preferable not to bundle all the messages in the main bundle but rather lazy-load only the language that the users selected.
 This can be achieved with **nuxt-i18n** by letting the module know where your translation files are located so it can dynamically import them when the app loads or when the user switches to another language.
 To enable translations lazy-loading, follow these 4 steps when configuring **nuxt-i18n**:
 
-* Set `lazy` option to `true`
-* Set `langDir` option to the directory that contains your translation files (this can NOT be empty)
-* Configure `locales` option as an array of object, where each object has a `file` key which value is the translation file corresponding to the locale
-* Optionally, remove all messages that you might have passed to vue-i18n via `vueI18n` option
-* Each `file` can return either an `Object` or a `function` (supports `Promises`)
+* Set `lazy` option to `true`.
+* Set `langDir` option to the directory (can not be empty) that contains your translation files. Only `*.js`, `*.ts` and `*.json` files will be loaded.
+* Configure `locales` option as an array of object, where each object has a `file` key which value is the translation file corresponding to the locale.
+* Optionally, remove all messages that you might have passed to vue-i18n via `vueI18n` option.
+* Each `file` can return either an `Object` or a `function` (supports `Promises`).
 
 Example files structure:
 

docs/content/es/lazy-load-translations.md

@@ -10,7 +10,7 @@ Esto se puede lograr con **nuxt-i18n** al permitir que el módulo sepa dónde se
 Para habilitar la carga diferida de traducciones, siga estos 4 pasos cuando configure **nuxt-i18n**:
 
 * Establezca la opción `lazy` en `true`
-* Establezca la opción `langDir` en el directorio que contiene sus archivos de traducción (esto NO puede estar vacío)
+* Establezca la opción `langDir` en el directorio (esto NO puede estar vacío) que contiene sus archivos de traducción. Only `*.js`, `*.ts` and `*.json` files will be loaded.
 * Configure la opción `locales` como una matriz de objetos, donde cada objeto tiene una clave `file` cuyo valor es el archivo de traducción correspondiente a la configuración local
 * Opcionalmente, elimine todos los mensajes que haya pasado a vue-i18n mediante la opción `vueI18n`
 * Cada `file` puede devolver un `Object` o una `function` (admite `Promises`)

src/templates/utils.js

@@ -28,7 +28,11 @@ export async function loadLanguageAsync (context, locale) {
         }
         if (!messages) {
           try {
-            const langFileModule = await import(/* webpackChunkName: "lang-[request]" */ `~/<%= options.langDir %>${file}`)
+            const langFileModule = await import(
+              /* webpackChunkName: "lang-[request]" */
+              /* webpackInclude: /\.(js|ts|json)$/ */
+              `~/<%= options.langDir %>${file}`
+            )
             const getter = langFileModule.default || langFileModule
             messages = typeof getter === 'function' ? await Promise.resolve(getter(context, locale)) : getter
           } catch (error) {