⭐ new: env variables

Author: kazupon

README.md

@@ -8,21 +8,35 @@ Vue CLI 3 plugin to add vue-i18n to your Vue Project
 ## :star: Features
 - [vue-i18n](https://github.com/kazupon/vue-i18n) basic scaffolding
 - Locale messages in Single File components with [vue-i18n-loader](https://github.com/kazupon/vue-i18n-loader)
+- Env Variables
 
 ## :rocket: Getting Started
 If yon don't have a project created with Vue CLI 3:
 
 ```sh
-$ vue create my-vue-app
+vue create my-vue-app
 ```
 
 Install the plugin into your project:
 
 ```sh
-$ cd my-vue-app
-$ vue add i18n
+cd my-vue-app
+vue add i18n
 ```
 
+## :clipboard: Env variables
+When vue-i18n code files had been scaffolded into your project, the following env variables generate into `.env`:
+
+- **`VUE_APP_I18N_LOCALE`**
+
+  The locale of project localization, default `en`.
+
+- **`VUE_APP_I18N_FALLBACK_LOCALE`**
+
+  The locale of project fallback localization, default `en`.
+
+These env variables are read in `src/i18n.(js|ts)`.
+
 ## :wrench: Configrations
 
 `vue-cli-plugin-i18n` have some plugin options in `vue.config.js`:

generator/index.js

@@ -5,21 +5,63 @@ function checkInstalled (target) {
   let ret = true
   try {
     const resolveModule = require(path.resolve(target))
-    if (!resolveModule) { ret = false }
+    if (!resolveModule) {
+      ret = false
+    }
+  } catch (e) {
+    ret = false
+  }
+  return ret
+}
+
+function exists (path) {
+  let ret = true
+  try {
+    fs.accessSync(path, fs.constants.F_OK)
+  } catch (e) {
+    ret = false
+  }
+  return ret
+}
+
+function mkdir (path) {
+  let ret = true
+  try {
+    fs.mkdirSync(path)
+  } catch (e) {
+    ret = false
+  }
+  return ret
+}
+
+function writeFile (path, content) {
+  let ret = true
+  try {
+    fs.writeFileSync(path, content, { encoding: 'utf8' })
   } catch (e) {
     ret = false
   }
   return ret
 }
 
+function readFile (path) {
+  let ret = ''
+  try {
+    ret = fs.readFileSync(path, { encoding: 'utf8' })
+  } catch (e) {
+    ret = ''
+  }
+  return ret
+}
+
 module.exports = (api, options, rootOptions) => {
-  const { enableInSFC } = options
+  const { locale, fallbackLocale, enableInSFC } = options
 
   try {
     const tsPath = api.resolve('src/main.ts')
     const jsPath = api.resolve('src/main.js')
-    const tsExists = fs.existsSync(tsPath)
-    const jsExists = fs.existsSync(jsPath)
+    const tsExists = exists(tsPath)
+    const jsExists = exists(jsPath)
 
     if (!tsExists && !jsExists) {
       api.exitLog('No entry found', 'error')
@@ -67,9 +109,6 @@ module.exports = (api, options, rootOptions) => {
      * render templates
      */
 
-    // common i18n templates
-    api.render('./templates/common', { ...additionalOptions })
-
     // i18n templates for program language
     api.render(`./templates/${lang}`, { ...additionalOptions })
 
@@ -88,6 +127,59 @@ module.exports = (api, options, rootOptions) => {
     api.exitLog(`unexpected error in vue-cli-plugin-i18n: ${e.message}`, 'error')
   }
 
+  api.onCreateComplete(() => {
+    const defaultLocaleMessages = JSON.stringify({
+      message: 'hello i18n !!'
+    }, null, 2)
+
+    function writeLocaleFile (path) {
+      if (!exists(path)) {
+        if (!writeFile(path, defaultLocaleMessages)) {
+          api.exitLog(`cannot make ${path}`, 'error')
+        }
+      } else {
+        console.warn(`already exist ${path}`)
+      }
+    }
+
+    const localesDirPath = api.resolve('./src/locales')
+    if (!exists(localesDirPath)) {
+      if (!mkdir(localesDirPath)) {
+        api.exitLog(`cannot make ${localesDirPath}`, 'error')
+      }
+    }
+
+    writeLocaleFile(api.resolve(`./src/locales/${locale}.json`))
+    if (locale !== fallbackLocale) {
+      writeLocaleFile(api.resolve(`./src/locales/${fallbackLocale}.json`))
+    }
+
+    const envPath = api.resolve('.env')
+    let content = exists(envPath) ? readFile(envPath) : ''
+
+    if (content.indexOf('VUE_APP_I18N_LOCALE=') === -1) {
+      content += `VUE_APP_I18N_LOCALE=${locale}\n`
+    } else {
+      content = content.replace(
+        /VUE_APP_I18N_LOCALE=(.*)\n/,
+        `VUE_APP_I18N_LOCALE=${locale}`
+      )
+    }
+
+    if (content.indexOf('VUE_APP_I18N_FALLBACK_LOCALE=') === -1) {
+      content += `VUE_APP_I18N_FALLBACK_LOCALE=${fallbackLocale}\n`
+    } else {
+      content = content.replace(
+        /VUE_APP_I18N_FALLBACK_LOCALE=(.*)\n/,
+        `VUE_APP_I18N_FALLBACK_LOCALE=${fallbackLocale}`
+      )
+    }
+
+    if (!writeFile(envPath, content)) {
+      api.exitLog(`cannot write ${envPath}`, 'error')
+    }
+  })
+
   api.postProcessFiles(files => {
     if (!api.hasPlugin('typescript')) { return }
     const tsConfigRaw = files['tsconfig.json']

generator/templates/common/src/locales/en.json

@@ -17,7 +17,7 @@ function loadLocaleMessages () {
 }
 
 export default new VueI18n({
-  locale: 'en',
-  fallbackLocale: 'en',
+  locale: process.env.VUE_APP_I18N_LOCALE || 'en',
+  fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || 'en',
   messages: loadLocaleMessages()
 })

generator/templates/js/src/i18n.js

@@ -17,7 +17,7 @@ function loadLocaleMessages (): LocaleMessages {
 }
 
 export default new VueI18n({
-  locale: 'en',
-  fallbackLocale: 'en',
+  locale: process.env.VUE_APP_I18N_LOCALE || 'en',
+  fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || 'en',
   messages: loadLocaleMessages()
 })

generator/templates/ts/src/i18n.ts

@@ -1,4 +1,16 @@
 module.exports = [{
+  type: 'input',
+  name: 'locale',
+  message: 'The locale of project localization.',
+  validate: input => !!input,
+  default: 'en'
+}, {
+  type: 'input',
+  name: 'fallbackLocale',
+  message: 'The locale of project fallback localization.',
+  validate: input => !!input,
+  default: 'en'
+}, {
   type: 'confirm',
   name: 'enableInSFC',
   message: 'Enable locale messages in Single file components ?',