Php Translation Js Extractor Bundle Laravel Package

Getting Started

Minimal Setup

1. Installation

   composer require coffreo/php-translation-js-extractor-bundle
   

   For Symfony 3.x, manually enable the bundle in AppKernel.php:

   new Coffreo\TranslationJsExtractorBundle\CoffreoTranslationJsExtractorBundle(),
   

2. Configuration Add the bundle to your config/packages/coffreo_translation_js_extractor.yaml:

   coffreo_translation_js_extractor:
       paths:
           - '%kernel.project_dir%/assets/js'
       file_pattern: '*.js'
       ignore_patterns: ['vendor', 'node_modules']
   

3. First Use Case Run the extraction command to generate translation keys from JS files:

   php bin/console coffreo:translation-js-extractor:extract
   

   This outputs extracted keys to var/translations/js_messages.{locale}.php (or your configured path).

Implementation Patterns

Integration with Laravel (Symfony-based)

1. Leverage Symfony Console Use the command in your Laravel project’s artisan wrapper:

   php artisan coffreo:translation-js-extractor:extract
   

   Add it to app/Console/Kernel.php for automated execution (e.g., post-deploy):

   protected function commands()
   {
       $this->load(__DIR__.'/../../vendor/coffreo/php-translation-js-extractor-bundle/src/Resources/config/commands.php');
   }
   

2. Workflow with php-translation

   • Extract JS keys:

     php artisan coffreo:translation-js-extractor:extract
     

   • Merge with PHP translations using php-translation:

     php artisan translation:extract
     php artisan translation:update
     

3. Frontend Integration Use the extracted JS translations in your frontend (e.g., Vue/React):

   // assets/js/app.js
   const translations = require('../../var/translations/js_messages.en.js');
   console.log(translations['key.from.js']);
   

4. Webpack/Vite Integration Configure your bundler to resolve JS translation files:

   // vite.config.js
   resolve: {
       alias: {
           'js-translations': path.resolve(__dirname, 'var/translations/js_messages.en.js'),
       },
   }
   

Gotchas and Tips

Pitfalls

1. File Pattern Mismatches

   • Ensure file_pattern in config matches your JS files (e.g., *.js, *.jsx).
   • Debug with --verbose:

     php artisan coffreo:translation-js-extractor:extract --verbose
     

2. Locale Handling

   • The bundle defaults to en if no locale is specified. Override in config:

     coffreo_translation_js_extractor:
         default_locale: 'fr'
     

3. Circular Dependencies

   • Avoid extracting translations from dynamically imported JS files (e.g., import('./dynamic.js')). Use static imports or configure ignore_patterns to exclude them.

4. Symfony vs. Laravel Quirks

   • Laravel’s artisan may not auto-discover the bundle. Ensure:
     • The bundle is listed in config/app.php (Symfony 4+).
     • Commands are loaded in app/Console/Kernel.php.

Debugging

• Dry Run: Test extraction without overwriting files:

  php artisan coffreo:translation-js-extractor:extract --dry-run
  

• Log Output: Enable debug mode in config:

  coffreo_translation_js_extractor:
      debug: true
  

Extension Points

1. Custom Extractors Extend the base extractor for custom JS syntax (e.g., i18next):

   // src/Extractor/CustomJsExtractor.php
   use Coffreo\TranslationJsExtractorBundle\Extractor\JsExtractorInterface;
   
   class CustomJsExtractor implements JsExtractorInterface {
       public function extract($fileContent) {
           // Custom logic for i18next, etc.
           return ['custom.key' => 'value'];
       }
   }
   

   Register in services:

   services:
       Coffreo\TranslationJsExtractorBundle\Extractor\JsExtractorInterface: '@App\Extractor\CustomJsExtractor'
   

2. Post-Processing Use Laravel’s post-update-cmd in composer.json to auto-extract translations:

   "scripts": {
       "post-update-cmd": [
           "@php artisan coffreo:translation-js-extractor:extract"
       ]
   }
   

3. Git Ignore Add extracted files to .gitignore if they’re auto-generated:

   /var/translations/js_messages.*.php