vite-plugin-drupal-t 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Märt Rang
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,145 @@
+# Drupal translations extract plugin for Vite
+
+A Vite plugin that automatically extracts `Drupal.t()` and `Drupal.formatPlural()` translation calls from your JavaScript/TypeScript source code into a separate file. This enables Drupal's translation system to discover and process strings from your Vite-built frontend applications, making internationalization seamless across your entire stack.
+
+The plugin scans your codebase during the build process, collects all translation calls, and outputs them as JavaScript comments in a `translations.js` file. Once included in your Drupal library, these strings become available for translation through Drupal's standard translation interface.
+
+## Installation
+
+```bash
+npm install vite-plugin-drupal-t --save-dev
+```
+
+## Usage
+
+Add to **vite.config.ts** file:
+```ts
+import { defineConfig } from 'vite'
+import extractDrupalT from 'vite-plugin-drupal-t'
+
+export default defineConfig({
+  plugins: [
+    extractDrupalT({
+      include: ['**/*.js', '**/*.ts', '**/*.vue'],
+    }),
+  ],
+})
+```
+
+Or if you need it only during build:
+
+```ts
+import { defineConfig } from 'vite'
+import extractDrupalT from 'vite-plugin-drupal-t'
+
+export default defineConfig({
+  build: {
+    rollupOptions: {
+      plugins: [
+        extractDrupalT({
+          include: ['**/*.js', '**/*.ts', '**/*.vue'],
+        }),
+      ],
+    },
+  },
+})
+```
+
+## Output
+
+The plugin creates a `translations.js` file in your build output directory (e.g., `dist/translations.js`). This file contains all translation strings found in the codebase as JavaScript comments:
+
+```javascript
+// Drupal.t('Welcome to the site')
+// Drupal.t('Hello @name', {'@name': userName})
+// Drupal.formatPlural(5, '1 item', '@count items', {})
+```
+
+The translations are commented out, so they won't execute at runtime, but Drupal's string extraction system can still find and process them.
+
+## Drupal Setup
+
+For Drupal to discover and extract these translation strings, you **must include the `translations.js` file in a Drupal library definition**.
+
+### Step 1: Add to your library definition
+
+In your theme or module's `*.libraries.yml` file (e.g., `mytheme.libraries.yml`):
+
+```yaml
+global:
+  js:
+    dist/translations.js: {}
+    dist/main.js: {}
+  css:
+    theme:
+      dist/style.css: {}
+```
+
+Or create a dedicated library just for translations:
+
+```yaml
+translations:
+  js:
+    dist/translations.js: {}
+
+main:
+  js:
+    dist/main.js: {}
+  dependencies:
+    - mytheme/translations
+```
+
+### Step 2: Attach the library
+
+Attach the library in your theme or module:
+
+**In your theme's `.info.yml` file:**
+```yaml
+libraries:
+  - mytheme/global
+```
+
+**Or programmatically in a hook:**
+```php
+/**
+ * Implements hook_page_attachments().
+ */
+function mytheme_page_attachments(array &$attachments) {
+  $attachments['#attached']['library'][] = 'mytheme/global';
+}
+```
+
+### Step 3: Extract translations
+
+Once the library is attached, Drupal's translation system will scan the `translations.js` file during:
+
+- **Interface translation updates** (Configuration → Regional and language → User interface translation)
+- **Locale module scanning** when enabled
+- **Drush locale:check** and **locale:update** commands
+
+The commented translation calls will be extracted and made available for translation in Drupal's translation interface.
+
+## Features
+
+- ✅ Extracts `Drupal.t()` calls
+- ✅ Extracts `Drupal.formatPlural()` calls
+- ✅ Supports single quotes, double quotes, and template literals
+- ✅ Supports multiline strings
+- ✅ Supports strings with parentheses
+- ✅ Supports parameters and context options
+- ✅ Automatically deduplicates identical translations
+- ✅ Sorts output alphabetically
+
+## Options
+
+### `include`
+Type: `string | string[]`
+Default: `undefined`
+
+A pattern or array of patterns to include files for extraction.
+
+### `exclude`
+Type: `string | string[]`
+Default: `undefined`
+
+A pattern or array of patterns to exclude files from extraction.

package/dist/index.d.ts

@@ -0,0 +1,6 @@
+import type { Plugin } from 'rollup';
+export interface ExtractDrupalTOptions {
+    include?: string | string[];
+    exclude?: string | string[];
+}
+export default function extractDrupalT(options?: ExtractDrupalTOptions): Plugin;

package/dist/index.js

@@ -0,0 +1,42 @@
+import { createFilter } from '@rollup/pluginutils';
+export default function extractDrupalT(options = {}) {
+    const filter = createFilter(options.include, options.exclude);
+    const translations = new Set();
+    return {
+        name: 'extract-drupal-t',
+        transform(code, id) {
+            if (!filter(id))
+                return null;
+            // Match Drupal.t('...') and (Drupal).t('...') calls, including parameters.
+            // Using [\s\S] instead of . to match multiline strings (including newlines)
+            const regex = /((\(Drupal\)|Drupal)\.t\((['"`][\s\S]*?['"`](?:,[\s\S]*?)*?)\))/g;
+            let match;
+            while ((match = regex.exec(code)) !== null) {
+                translations.add(match[0]);
+            }
+            // Match Drupal.formatPlural('...', '...', '...', ...);
+            // Using [\s\S] instead of . to match multiline strings (including newlines)
+            const pluralRegex = /((\(Drupal\)|Drupal)\.formatPlural\((\d+),\s*(['"`][\s\S]*?['"`]),\s*(['"`][\s\S]*?['"`]),\s*([\s\S]*?)(?:,\s*([\s\S]*?))?\))/g;
+            let pluralMatch;
+            while ((pluralMatch = pluralRegex.exec(code)) !== null) {
+                translations.add(pluralMatch[0]);
+            }
+            return null;
+        },
+        generateBundle() {
+            const bundleContent = Array.from(translations)
+                // Sort translations to ensure consistent order.
+                .sort()
+                // Format each translation as a comment.
+                // Replace '(Drupal)' with 'Drupal' for consistency.
+                // Drupal can find the translations it needs to include.
+                .map((translation) => `// ${translation.replace('(Drupal)', 'Drupal')}`)
+                .join('\n');
+            this.emitFile({
+                type: 'asset',
+                fileName: 'translations.js',
+                source: bundleContent,
+            });
+        },
+    };
+}

package/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "vite-plugin-drupal-t",
+  "version": "1.0.0",
+  "description": "A Vite plugin that automatically extracts Drupal.t() and Drupal.formatPlural() translation calls for seamless internationalization",
+  "author": "Märt Rang <rang501@gmail.com>",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/rang501/vite-plugin-drupal-t.git"
+  },
+  "bugs": {
+    "url": "https://github.com/rang501/vite-plugin-drupal-t/issues"
+  },
+  "homepage": "https://github.com/rang501/vite-plugin-drupal-t#readme",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "scripts": {
+    "build": "tsc",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:ui": "vitest --ui",
+    "prepublishOnly": "npm run build"
+  },
+  "keywords": [
+    "vite",
+    "vite-plugin",
+    "drupal",
+    "translations",
+    "i18n",
+    "internationalization",
+    "l10n",
+    "localization",
+    "drupal-t",
+    "formatPlural"
+  ],
+  "dependencies": {
+    "@rollup/pluginutils": "^4.2.1"
+  },
+  "devDependencies": {
+    "@types/estree": "^1.0.7",
+    "@types/node": "^24.10.1",
+    "@vitest/ui": "^3.2.4",
+    "typescript": "^5.0.0",
+    "vite": "^7.2.4",
+    "vitest": "^3.2.4"
+  },
+  "peerDependencies": {
+    "vite": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0"
+  }
+}