{"id":20441206,"url":"https://github.com/thomas-darling/translation-loader","last_synced_at":"2025-10-03T14:05:39.609Z","repository":{"id":31868005,"uuid":"129300868","full_name":"thomas-darling/translation-loader","owner":"thomas-darling","description":"Webpack loader that localizes HTML templates and JSON files by injecting translated content.","archived":false,"fork":false,"pushed_at":"2023-01-06T01:33:33.000Z","size":666,"stargazers_count":4,"open_issues_count":10,"forks_count":3,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-09-20T17:02:11.441Z","etag":null,"topics":["angular","aurelia","g11n","globalization","i18n","internationalization","l10n","localization","template","translation","webpack","webpack-loader"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/thomas-darling.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-04-12T19:22:42.000Z","updated_at":"2023-03-13T10:41:07.000Z","dependencies_parsed_at":"2023-01-14T19:57:28.658Z","dependency_job_id":null,"html_url":"https://github.com/thomas-darling/translation-loader","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/thomas-darling/translation-loader","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thomas-darling%2Ftranslation-loader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thomas-darling%2Ftranslation-loader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thomas-darling%2Ftranslation-loader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thomas-darling%2Ftranslation-loader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/thomas-darling","download_url":"https://codeload.github.com/thomas-darling/translation-loader/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thomas-darling%2Ftranslation-loader/sbom","scorecard":{"id":882160,"data":{"date":"2025-08-11","repo":{"name":"github.com/thomas-darling/translation-loader","commit":"1b36d0cd37eb1082e6c6c3777896b89daf80de6a"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":1.5,"checks":[{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Code-Review","score":0,"reason":"Found 0/10 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"SAST","score":0,"reason":"no SAST tool detected","details":["Warn: no pull requests merged into dev branch"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"License","score":0,"reason":"license file not detected","details":["Warn: project does not have a license file"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":-1,"reason":"internal error: error during branchesHandler.setup: internal error: githubv4.Query: Resource not accessible by integration","details":null,"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"Vulnerabilities","score":0,"reason":"31 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-x9w5-v3q2-3rhw","Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275","Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq","Warn: Project is vulnerable to: GHSA-r9p9-mrjm-926w","Warn: Project is vulnerable to: GHSA-434g-2637-qmqr","Warn: Project is vulnerable to: GHSA-49q7-c7j4-3p7m","Warn: Project is vulnerable to: GHSA-977x-g7h5-7qgw","Warn: Project is vulnerable to: GHSA-f7q4-pwc6-w24p","Warn: Project is vulnerable to: GHSA-fc9h-whq2-v747","Warn: Project is vulnerable to: GHSA-vjh7-7g9h-fjfh","Warn: Project is vulnerable to: GHSA-ww39-953v-wcq6","Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37","Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h","Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq","Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488","Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g","Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3","Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h","Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr","Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9","Warn: Project is vulnerable to: GHSA-h7cp-r72f-jxh6","Warn: Project is vulnerable to: GHSA-v62p-rq8g-8h59","Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw","Warn: Project is vulnerable to: GHSA-vx3p-948g-6vhq","Warn: Project is vulnerable to: GHSA-4wf5-vphf-c2xc","Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-24T08:36:58.607Z","repository_id":31868005,"created_at":"2025-08-24T08:36:58.607Z","updated_at":"2025-08-24T08:36:58.607Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278173367,"owners_count":25942293,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-03T02:00:06.070Z","response_time":53,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","aurelia","g11n","globalization","i18n","internationalization","l10n","localization","template","translation","webpack","webpack-loader"],"created_at":"2024-11-15T09:30:43.999Z","updated_at":"2025-10-03T14:05:39.577Z","avatar_url":"https://github.com/thomas-darling.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"translation-loader\n==================\n\n[![Version](https://img.shields.io/npm/v/translation-loader.svg)](https://www.npmjs.org/package/translation-loader)\n[![Downloads](https://img.shields.io/npm/dm/translation-loader.svg)](https://www.npmjs.com/package/translation-loader)\n[![Try on RunKit](https://badge.runkitcdn.com/translation-loader.svg)](https://runkit.com/npm/translation-loader)\n\nWebpack loader that localizes HTML templates and JSON files by injecting translated content, replacing the original content that was previously exported for translation.\n\nThis leverages the core functionality of [gulp-translate](https://www.npmjs.com/package/gulp-translate), allowing that exact same workflow to be used in a Webpack build process, with no dependency on Gulp.\n\nPlease refer to the documentation for [gulp-translate](https://www.npmjs.com/package/gulp-translate) for details on capabilities and configuration.\n\n## What about the export?\n\nWhile 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 a Gulp task and [gulp-translate](https://www.npmjs.com/package/gulp-translate), or if you do not wish to take a dependency on Gulp, to write a simple script that uses the core export functionality of [gulp-translate](https://www.npmjs.com/package/gulp-translate) directly.\n\n## Example\n\nThe 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 that the code shown here also exists as a working example in the repository for this package.\n\n### `webpack.config.js`\n\nLet's say you have a Webpack configuration that looks like the example below. Here the templates and JSON content files are piped through the `translation-loader`, before being passed to the regular loaders.\n\n\u003e Note that Webpack applies the loaders from right to left, so the order shown here is correct.\n\n\u003e Note that Webpack has built in support for JSON files, which is why no JSON loader is needed.\n\n```javascript\nconst path = require(\"path\");\nconst translateConfig = require(\"./translate-config\");\n\n/**\n * The Webpack configuration.\n */\nconst webpackConfig =\n{\n    entry: \"./source/entry.js\",\n    output:\n    {\n        path: path.resolve(\"./artifacts\"),\n\n        // This will be set based on the locale for which we are building.\n        filename: undefined\n    },\n    module:\n    {\n        rules:\n        [\n            {\n                test: /\\.html$/,\n                use:\n                [\n                    { loader: \"html-loader\" },\n                    { loader: \"translation-loader\", options: translateConfig }\n                ]\n            },\n            {\n                test: /[/\\\\]content\\.json$/,\n                use:\n                [\n                    { loader: \"translation-loader\", options: translateConfig }\n                ]\n            }\n        ]\n    }\n};\n\n/**\n * Creates the Webpack configuration based on the command line arguments.\n * @param env An object representing the specified 'env' arguments, or undefined.\n * @returns The Webpack configuration to use.\n */\nmodule.exports = function(env)\n{\n    if (env \u0026\u0026 env.locale)\n    {\n        // To build for the specified locale, set the import file path.\n        translateConfig.importFilePath =\n            translateConfig.importFilePath.replace(\"{locale}\", env.locale);\n\n        // Set the output file name so we get a bundle for each locale.\n        webpackConfig.output.filename = `bundle.${env.locale}.js`;\n    }\n    else\n    {\n        // To build for the base locale without an import file, exclude all files.\n        translateConfig.excludedFilePaths = [\"**\"];\n\n        // Set the output file name so we get a bundle for each locale.\n        webpackConfig.output.filename = \"bundle.en-US.js\";\n    }\n\n    return webpackConfig;\n};\n```\n\n### `translate-export.js`\n\nWhile Webpack handles the import and build, you'll also need a way to export the content from your templates and JSON files, so it can be sent off for translation. This can be done using a script like the example below.\n\n```javascript\nconst fs = require(\"fs\");\nconst globs = require(\"globs\");\nconst translatePlugin = require(\"gulp-translate/lib/plugin/plugin\");\nconst translateConfig = require(\"./translate-config\");\n\n// Get the source file paths.\nconst filePaths = globs.sync(translateConfig.includedFilePaths,\n{\n    ignore: translateConfig.excludedFilePaths\n});\n\n// Create the export task.\nconst plugin = new translatePlugin.Plugin(translateConfig);\nconst task = plugin.export(translateConfig);\n\n// Process the source files.\nfor (let filePath of filePaths)\n{\n    const fileContents = fs.readFileSync(filePath);\n    const file = { contents: fileContents, path: filePath };\n\n    task.process(file);\n}\n\n// Finalize the export task.\ntask.finalize();\n```\n\nDepending on your workflow, you could consider automatically uploading the export file to your translation service of choice, and maybe have a similar script you can run to download the translations once they are ready.\n\n### `translate-config.js`\n\nThis file contains the configuration used during both content export translation import.\u003cbr\u003e\nPlease refer to the documentation for [gulp-translate](https://www.npmjs.com/package/gulp-translate) for details.\n\n```javascript\n/**\n * The configuration used during content export and translation import.\n * Note that paths must be absolute or relative to the current working directory.\n */\nmodule.exports =\n{\n    // Options for 'gulp-translate'.\n    // Note how the plugin and command options are all in the same object,\n    // instead of being separated as in the 'gulp-translate' documentation.\n\n    normalizeContent: true,\n    prefixIdsInContentFiles: true,\n    baseFilePath: \"./source\",\n\n    // The path to the export file to which content should be exported.\n    exportFilePath: \"./translation/export/translate.json\",\n\n    // The path to the import file from which content should be imported,\n    // where '{locale}' should be replaced with the locale code.\n    importFilePath: \"./translation/import/{locale}.json\",\n\n    // Options for 'translation-loader' and the export script.\n\n    /**\n     * An array of glob patterns matching files that should be included in the export.\n     * Make sure this matches the tests guarding the use of the 'translation-loader' in your\n     * Webpack configuration.\n     */\n    includedFilePaths:\n    [\n        \"./source/**/*.html\",\n        \"./source/**/content.json\"\n    ],\n\n    /**\n     * An array of glob patterns matching files that should be excluded from import and export.\n     * Use this to exclude files related to features that are not yet ready for translation.\n     * Default is undefined.\n     */\n    excludedFilePaths:\n    [\n        \"./source/excluded/**\"\n    ]\n};\n```\n\n### How to use\n\nFinally, to make your tasks more discoverable, you can add something like the following to your `package.json` file.\n\n```js\n\"scripts\":\n{\n  \"build\": \"webpack\",\n  \"translate-export\": \"node translate-export\",\n  \"translate-import\": \"node translate-import\"\n}\n```\n\nWith this in place, you can execute the following commands:\n\n* `npm run build`\u003cbr\u003e\n  This will produce a build for the base locale, which could be e.g. `en-US`.\n\n* `npm run build --env.locale=en-GB`\u003cbr\u003e\n  This will produce a build localized for the `en-GB` locale, where the contents of your templates and JSON files is replaced with the translated content.\n\n* `npm run translate-export`\u003cbr\u003e\n  This will export the contents of your templates and JSON files into a file that can be sent to translators, who then produce the import files needed during the build.\n\n* `npm run translate-import`\u003cbr\u003e\n  This would be a convenient way to download the lates translations into your repository.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthomas-darling%2Ftranslation-loader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthomas-darling%2Ftranslation-loader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthomas-darling%2Ftranslation-loader/lists"}