Implement support for vuex-i18n library (martinlindhe#31)

* Implement support for vuex-i18n library

The package is nearly ready to support vuex-i18n out of the box. One significally
difference between vue-i18n and vuex-i18n is the way the handle plural forms.
While vue-i18n using the pipe `|`, vuex-i18n uses three colons `:::`.

The patch introduces a new flag to specify which i18n lib are used. The generator
replaces than the pipe by three colons.

* Update note about pluralization

Author: Konafets

README.md

@@ -3,10 +3,10 @@
 
 
 Laravel 5 package that allows you to share your [Laravel localizations](http://laravel.com/docs/5.1/localization)
-with your [vue](http://vuejs.org/) front-end, using [vue-i18n](https://github.com/kazupon/vue-i18n).
+with your [vue](http://vuejs.org/) front-end, using [vue-i18n](https://github.com/kazupon/vue-i18n) or [vuex-i18n](https://github.com/dkfbasel/vuex-i18n).
 
 
-## Usage
+## Install the package
 
 In your project:
 ```composer require martinlindhe/laravel-vue-i18n-generator```
@@ -23,6 +23,20 @@ Next, publish the package default config:
 php artisan vendor:publish --provider="MartinLindhe\VueInternationalizationGenerator\GeneratorProvider"
 ```
 
+## Using vue-i18n
+
+Next, you need to install one out of two supported VueJs i18n libraries. We support [vue-i18n](https://github.com/kazupon/vue-i18n) as default library. Beside that we also support [vuex-i18n](https://github.com/dkfbasel/vuex-i18n).
+
+When you go with the default option, you only need to install the library through your favorite package manager.
+### vue-i18n
+```
+npm -i --save vue-i18n
+```
+
+```
+yarn add vue-i18n
+```
+
 Then generate the include file with
 ```
 php artisan vue-i18n:generate
@@ -60,6 +74,47 @@ Vue.use(VueInternationalization, {
 
 ...
 ```
+## Using vuex-i18n
+ 
+### vuex-i18n
+```
+npm -i --save vuex-i18n
+```
+
+```
+yarn add vuex-i18n
+```
+
+Next, open `config/vue-i18n-generator.php` and do the following changes:
+
+```php
+- 'i18nLib' => \MartinLindhe\VueInternationalizationGenerator\Generator::VUE_I18N,
++ 'i18nLib' => \MartinLindhe\VueInternationalizationGenerator\Generator::VUEX_I18N,
+```
+
+Then generate the include file with
+```
+php artisan vue-i18n:generate
+```
+
+Assuming you are using a recent version of vuex-i18n, adjust your vue app with something like:
+```js
+import store from './vuex';
+import vuexI18n from 'vuex-i18n';
+Vue.use(vuexI18n.plugin, store);
+
+import Locales from './vue-i18n-locales.generated.js';
+Vue.i18n.add('en', Locales.en);
+Vue.i18n.add('de', Locales.de);
+
+// set the start locale to use
+Vue.i18n.set('en');
+
+const app = new Vue({
+    store, // inject store into all children
+    el: '#app',
+});
+```
 
 ## UMD module
 
@@ -121,10 +176,14 @@ Vue template:
 
 ## Notices
 
-The generated file is an ES6 module.
+- The generated file is an ES6 module.
 
-[Pluralization](http://laravel.com/docs/5.1/localization#pluralization) don't work with vue-i18n
+- One note on [Pluralization](http://laravel.com/docs/5.5/localization#pluralization). This used not to work with vue-i18n but as mentioned at [#12](https://github.com/martinlindhe/laravel-vue-i18n-generator/issues/12)
+they might work since vue-i18n uses the same syntax for separation of singular and plural form as Laravel does. So far this is not confirmed.
 
+  On the other hand it has been tested that pluralization work with vuex-i18n for simple singular / plural forms. However, the 
+  more sophisticated localization as described [here](https://laravel.com/docs/5.5/localization#pluralization) is not supported since
+  vuex-i18n does not support this.
 
 # License
 

src/Commands/GenerateInclude.php

@@ -18,7 +18,7 @@ class GenerateInclude extends Command
      *
      * @var string
      */
-    protected $description = "Generates a vue-i18n compatible js array out of project translations";
+    protected $description = "Generates a vue-i18n|vuex-i18n compatible js array out of project translations";
 
     /**
      * Execute the console command.
@@ -32,17 +32,20 @@ public function handle()
 
         $multipleFiles = $this->option('multi');
 
+        $i18nLib = config('vue-i18n-generator.i18nLib');
+
         if ($multipleFiles) {
-            $files = (new Generator)
+            $files = (new Generator($i18nLib))
                 ->generateMultiple($root, $umd);
             echo "Written to :" . PHP_EOL . $files . PHP_EOL;
             exit();
         }
 
-        $data = (new Generator)
+        $data = (new Generator($i18nLib))
             ->generateFromPath($root, $umd);
 
 
+
         $jsFile = base_path() . config('vue-i18n-generator.jsFile');
         file_put_contents($jsFile, $data);
 

src/Generator.php

@@ -10,6 +10,21 @@ class Generator
     private $availableLocales = [];
     private $filesToCreate = [];
 
+    const VUEX_I18N = 'vuex-i18n';
+    const VUE_I18N = 'vue-i18n';
+
+    private $i18nLib;
+
+    /**
+     * The constructor
+     *
+     * @param string $i18nLib
+     */
+    public function __construct($i18nLib = self::VUE_I18N)
+    {
+        $this->i18nLib = $i18nLib;
+    }
+
     /**
      * @param string $path
      * @param boolean $umd
@@ -207,7 +222,9 @@ private function adjustArray(array $arr)
     }
 
     /**
-     * Turn Laravel style ":link" into vue-i18n style "{link}"
+     * Turn Laravel style ":link" into vue-i18n style "{link}" and
+     * turn Laravel style "|" into vuex-i18n style ":::" when using vuex-i18n.
+     *
      * @param string $s
      * @return string
      */
@@ -217,6 +234,13 @@ private function adjustString($s)
             return $s;
         }
 
+        if ($this->i18nLib === self::VUEX_I18N) {
+            $searchPipePattern = '/(\s)*(\|)(\s)*/';
+            $threeColons = ' ::: ';
+
+            $s = preg_replace($searchPipePattern, $threeColons, $s);
+        }
+
         return preg_replace_callback(
             '/(?<!mailto|tel):\w+/',
             function ($matches) {

src/config/vue-i18n-generator.php

@@ -24,5 +24,17 @@
     |
     */
     'jsPath' => '/resources/assets/js/langs/',
-    'jsFile' => '/resources/assets/js/vue-i18n-locales.generated.js'
+    'jsFile' => '/resources/assets/js/vue-i18n-locales.generated.js',
+
+    /*
+    |--------------------------------------------------------------------------
+    | i18n library
+    |--------------------------------------------------------------------------
+    |
+    | Specify the library you use for localization.
+    | Options are vue-i18n or vuex-i18n.
+    | You can also use Generator::VUE_I18N or Generator::VUEX_I18N
+    |
+    */
+    'i18nLib' => \MartinLindhe\VueInternationalizationGenerator\Generator::VUE_I18N,
 ];

tests/GenerateTest.php

@@ -130,6 +130,45 @@ function testBasic()
         $this->destroyLocaleFilesFrom($arr, $root);
     }
 
+    function testBasicWithVuexLib()
+    {
+        $arr = [
+            'en' => [
+                'help' => [
+                    'yes' => 'yes',
+                    'no' => 'no',
+                ]
+            ],
+            'sv' => [
+                'help' => [
+                    'yes' => 'ja',
+                    'no' => 'nej',
+                ]
+            ]
+        ];
+
+        $root = $this->generateLocaleFilesFrom($arr);
+
+        $this->assertEquals(
+            'export default {' . PHP_EOL
+            . '    "en": {' . PHP_EOL
+            . '        "help": {' . PHP_EOL
+            . '            "yes": "yes",' . PHP_EOL
+            . '            "no": "no"' . PHP_EOL
+            . '        }' . PHP_EOL
+            . '    },' . PHP_EOL
+            . '    "sv": {' . PHP_EOL
+            . '        "help": {' . PHP_EOL
+            . '            "yes": "ja",' . PHP_EOL
+            . '            "no": "nej"' . PHP_EOL
+            . '        }' . PHP_EOL
+            . '    }' . PHP_EOL
+            . '}' . PHP_EOL,
+            (new Generator('vuex-i18n'))->generateFromPath($root));
+
+        $this->destroyLocaleFilesFrom($arr, $root);
+    }
+
     function testNamed()
     {
         $arr = [
@@ -219,4 +258,71 @@ function testShouldNotTouchHtmlTags()
 
         $this->destroyLocaleFilesFromJSON($arr, $root);
     }
+
+    function testPlurals()
+    {
+        $arr = [
+            'en' => [
+                'plural' => [
+                    'one' => 'There is one apple|There are many apples',
+                    'two' => 'There is one apple | There are many apples',
+                    'three' => 'There is one apple    | There are many apples',
+                    'four' => 'There is one apple |     There are many apples',
+                    'five' => [
+                        'one' => 'There is one apple|There are many apples',
+                        'two' => 'There is one apple | There are many apples',
+                        'three' => 'There is one apple    | There are many apples',
+                        'four' => 'There is one apple |     There are many apples',
+                    ]
+                ]
+            ]
+        ];
+
+        $root = $this->generateLocaleFilesFrom($arr);
+
+        $this->assertEquals(
+            'export default {' . PHP_EOL
+            . '    "en": {' . PHP_EOL
+            . '        "plural": {' . PHP_EOL
+            . '            "one": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '            "two": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '            "three": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '            "four": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '            "five": {' . PHP_EOL
+            . '                "one": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '                "two": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '                "three": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '                "four": "There is one apple ::: There are many apples"' . PHP_EOL
+            . '            }' . PHP_EOL
+            . '        }' . PHP_EOL
+            . '    }' . PHP_EOL
+            . '}' . PHP_EOL,
+            (new Generator('vuex-i18n'))->generateFromPath($root));
+
+        $this->destroyLocaleFilesFrom($arr, $root);
+
+        $root = $this->generateLocaleFilesFromJSON($arr);
+
+        $this->assertEquals(
+            'export default {' . PHP_EOL
+            . '    "en": {' . PHP_EOL
+            . '        "plural": {' . PHP_EOL
+            . '            "one": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '            "two": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '            "three": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '            "four": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '            "five": {' . PHP_EOL
+            . '                "one": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '                "two": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '                "three": "There is one apple ::: There are many apples",' . PHP_EOL
+            . '                "four": "There is one apple ::: There are many apples"' . PHP_EOL
+            . '            }' . PHP_EOL
+            . '        }' . PHP_EOL
+            . '    }' . PHP_EOL
+            . '}' . PHP_EOL,
+            (new Generator('vuex-i18n'))->generateFromPath($root));
+
+        $this->destroyLocaleFilesFromJSON($arr, $root);
+    }
+
 }