translation-loader - npm Package Compare versions

Comparing version 0.1.0 to 1.0.0

lib/loader-options.d.ts

 import { IPluginConfig } from "gulp-translate/lib/plugin/plugin-config";
 import { IImportTaskConfig } from "gulp-translate/lib/plugin/import/import-task-config";
+import { IExportTaskConfig } from "gulp-translate/lib/plugin/export/export-task-config";
 /**
  * Represents the options for the loader.
  */
-export interface ILoaderOptions extends IPluginConfig, IImportTaskConfig {
+export interface ILoaderOptions extends IPluginConfig, IImportTaskConfig, IExportTaskConfig {
     /**
+     * True to skip importing, and just pass through the base content,
+     * false to import normally. Note that if you explicitly enable this,
+     * you may set the `importFilePath` to an empty array.
+     * Default is false.
+     */
+    skipImport?: boolean;
+    /**
      * An array of glob patterns matching files that should be excluded from import and export.
      * Use this to exclude files related to features that are not yet ready for translation.
+     * Default is undefined.
      */
     excludeGlobs?: string[];
 }

lib/loader.js

 "use strict";
+var __assign = (this && this.__assign) || Object.assign || function(t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+        s = arguments[i];
+        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+            t[p] = s[p];
+    }
+    return t;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
@@ -14,19 +22,37 @@ var path = require("path");
 function loader(fileContents) {
-    // Get the options for the translate plugin and import task.
-    var options = (loaderUtils.getOptions(this) || {});
-    // Get the path and base path of the file being loaded.
+    // Get a copy of the options for the translate plugin and import task.
+    var options = __assign({}, loaderUtils.getOptions(this));
+    // Get the path of the file being loaded.
     var filePath = this.resourcePath;
     // Skip the import if the file path matches any exclude globs.
-    if (options.excludeGlobs != null) {
+    if (!options.skipImport && options.excludeGlobs != null) {
         var excludeGlobs = options.excludeGlobs.map(function (glob) { return path.join(process.cwd(), glob); });
         if (excludeGlobs.some(function (glob) { return minimatch.match([filePath], glob).length > 0; })) {
-            return fileContents;
+            options.skipImport = true;
         }
     }
-    // Add the import file as a dependency for the file being loaded.
-    this.addDependency(options.importFilePath);
-    // Create the translate plugin, import task and file.
-    var task = new plugin_1.Plugin(options).import(options);
+    if (!options.skipImport) {
+        // Add the import file as a dependency for the file being loaded.
+        if (options.importFilePath instanceof Array) {
+            for (var _i = 0, _a = options.importFilePath; _i < _a.length; _i++) {
+                var importFilePath = _a[_i];
+                this.addDependency(importFilePath);
+            }
+        }
+        else {
+            this.addDependency(options.importFilePath);
+        }
+    }
+    else {
+        // We need the export task to clean the templates, but we don't want to actually export anything.
+        options.exportFilePath = undefined;
+    }
+    // Create the translate plugin.
+    var plugin = new plugin_1.Plugin(options);
+    // Create the task, which may be either an import task or an export task, depending on whether the import
+    // should be skipped or not. If the import is skipped, the export task will simply clean the templates.
+    var task = options.skipImport ? plugin.export(options) : plugin.import(options);
+    // Create the file to be processed.
     var file = { contents: fileContents, path: filePath };
-    // Execute the import task.
+    // Process the file.
     var callback = this.async();
@@ -33,0 +59,0 @@ task.process(file)

package.json

 {
   "name": "translation-loader",
-  "version": "0.1.0",
+  "version": "1.0.0",
   "description": "Webpack loader that localizes HTML templates and JSON files by injecting translated content.",
@@ -35,2 +35,3 @@ "keywords": [
     "@types/loader-utils": "^1.1.3",
+    "@types/minimatch": "^3.0.3",
     "chalk": "^2.3.2",
@@ -42,5 +43,4 @@ "gulp-translate": "^1.5.4",
   "devDependencies": {
-    "@types/globby": "^6.1.0",
     "@types/node": "^8.0.1",
-    "globby": "^6.0.0",
+    "globs": "^0.1.3",
     "html-loader": "^0.5.5",
@@ -47,0 +47,0 @@ "json-loader": "^0.5.7",

readme.md

@@ -8,24 +8,20 @@ translation-loader
 
-Webpack loader that injects translated content into HTML templates and JSON files.
+Webpack loader that localizes HTML templates and JSON files by injecting translated content.
 
-This is build on top of the core import functionality of [gulp-translate](https://www.npmjs.com/package/gulp-translate),
-allowing that same workflow to be used together with a Webpack based build process, in which templates and JSON files
-will be localized when they are loaded by Webpack.
+This is build on top of the core import functionality of [gulp-translate](https://www.npmjs.com/package/gulp-translate), allowing that same workflow to be used together with a Webpack based build process, in which templates and JSON files will be localized when they are loaded by Webpack.
 
-Please refer to the docs for [gulp-translate](https://www.npmjs.com/package/gulp-translate) for details on capabilities and configuration.<br>
-Note that the repository for this loader also contains an example illustrating how this may be used.
+Please refer to the docs for [gulp-translate](https://www.npmjs.com/package/gulp-translate) for details on capabilities and configuration.
 
 ## What about the export?
 
-While this loader handles the import of translations, you will also need to export your content for translation.
-The recommended way to do that, is to either use [gulp-translate](https://www.npmjs.com/package/gulp-translate) together with a Gulp task, or if you do not wish to take a dependency
-on Gulp, to write a simple `package.json` script that uses the core export functionality of [gulp-translate](https://www.npmjs.com/package/gulp-translate) directly.
+While this loader handles the import of translations, you will also need to export your content for translation. The recommended way to do that, is to either use [gulp-translate](https://www.npmjs.com/package/gulp-translate) in a Gulp task, or if you do not wish to take a dependency on Gulp, to write a simple `package.json` script that uses the core export functionality of [gulp-translate](https://www.npmjs.com/package/gulp-translate) directly.
 
 ## Example
 
-The following is an example of how this loader might be used in a Webpack configuration,
-together with a `package.json` script for exporting content for translation.
+The following example illustrates how this loader may be used in a Webpack configuration, as well as how a `package.json` script for exporting content may be written. Note the code shown here also exists as a working example in the repository for this package.
 
 ### `webpack.config.js`
 
+Let's say you have a webpack configuration that looks like the example below. Note how the templates and JSON content files are piped through the `translation-loader`, before being passed to the regular loaders - and yes, Webpack applies the loaders from right to left, so the order shown here is correct.
+
 ```javascript
@@ -35,3 +31,4 @@ const path = require("path");
 
-module.exports =
+// The webpack configuration.
+const webpackConfig =
 {
@@ -68,2 +65,20 @@ entry: "./source/entry.js",
 };
+
+// Handle command line arguments and return the webpack configuration.
+module.exports = function(env)
+{
+    if (env && env.locale)
+    {
+        // To build for the specified locale, set the import file path.
+        translateConfig.importFilePath =
+            `./translation/import/${env.locale}.json`;
+    }
+    else
+    {
+        // To build for the base locale, just skip the import.
+        translateConfig.skipImport = true;
+    }
+
+    return webpackConfig;
+};
 ```
@@ -73,2 +88,4 @@
 
+While webpack handles the import and build, you'll also need a way to export the content from your templates and JSON content files, so it can be sent off for translation. This can be done using a script like the example below.
+
 ```javascript
@@ -90,8 +107,14 @@ const fs = require("fs");
     ...translateConfig.excludeGlobs
-        .map(glob => "!" + path.join(__dirname, glob))
+        .map(glob => `!${path.join(__dirname, glob)}`)
 ]);
 
 // Create the translate plugin and export task.
-const task = new translate.Plugin(translateConfig).export(translateConfig);
+const task = new translate.Plugin(translateConfig).export(
+{
+    ...translateConfig,
 
+    // The path to the export file, to which the content should be exported.
+    exportFilePath: "./translation/export/translate.json"
+});
+
 // Process the source files.
@@ -107,2 +130,7 @@ for (let filePath of filePaths)
 task.finalize();
+
+// TODO:
+// Depending on your workflow, you could consider automatically uploading
+// the file to your translation service of choice, and maybe have a similar
+// script for downloading the translations once they are ready.
 ```
@@ -112,2 +140,4 @@
 
+This is the configuration needed during both import and export.
+
 ```javascript
@@ -122,10 +152,8 @@ module.exports =
     baseFilePath: "./source",
-    importFilePath: "./translation/import/translation.json",
-    exportFilePath: "./translation/export/translation.json",
 
     // This option is specific to this loader and not part of gulp-translate.
-    // It allows you to specify glob patterns for files for which import
+    // It allows you to specify glob patterns matching files for which import
     // and export should be skipped, e.g. because they belong to a feature
     // that is not yet ready for translation.
-    excludeGlobs: ["./unfinished-feature/**"]
+    excludeGlobs: ["./source/excluded/**"]
 
@@ -136,4 +164,6 @@ // Note that all paths are relative to the current working directory.
 
-### Finally, add this to your `package.json` file
+### How to use
 
+Finally, to make your build tasks more discoverable, you can consider adding something like the following this to your `package.json` file.
+
 ```js
@@ -143,7 +173,18 @@ "scripts":
   "build": "webpack",
-  "export": "node translate-export.js"
+  "translate-export": "node translate-export"
+
+  // If you also have a script to download translations...
+  "translate-import": "node translate-import"
 }
 ```
 
-This allows you to build your project by executing the command `node build`,
-and to export strings for translation by executing the command `node export`.
+With this in place, you can execute the following commands:
+
+* `npm build`<br>
+  This will produce a build for the base locale, which could be e.g. `en-US`.
+
+* `npm build --env.locale=en-GB`<br>
+  This will produce a build localized for the `en-GB` locale, where the contents of your templates and JSON content files is replaced with the translated content.
+
+* `npm translate-export`<br>
+  This will export the contents of your templates and JSON content files into a file that can be sent to translators, who then produce the translation files needed during the build.

tslint.json

@@ -13,2 +13,6 @@ {
     ],
+    "comment-format": [
+      true,
+      "check-space"
+    ],
     "cyclomatic-complexity": false,
@@ -52,2 +56,3 @@ "linebreak-style": [
     "no-null-keyword": false,
+    "no-object-literal-type-assertion": false,
     "object-literal-sort-keys": false,
@@ -60,2 +65,3 @@ "one-line": false,
     "ordered-imports": false,
+    "prefer-conditional-expression": false,
     "prefer-function-over-method": false,
@@ -62,0 +68,0 @@ "prefer-switch": false,

Fixed alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

14733

increased by34.57%

Dev dependency count

7

decreased by-12.5%

Lines of code

199

increased by25.95%

Number of low quality alerts

0

decreased by-100%

Number of lines in readme file

181

increased by29.29%

Worsened metrics

Dependency count

6

increased by20%

Dependency changes

• + Added@types/minimatch@^3.0.3

• + Added@types/minimatch@3.0.5(transitive)