Question

我在我的应用程序中使用React-Intl，并且效果很好，但是为了更轻松地管理新的翻译键，我开始使用“ react-intl-translations-manager”。

我的问题是我的某些翻译是通过通知系统使用的，而babel提取器无法识别它们，因为它不在他的扫描范围之内。

因此，当我运行“ react-intl-translations-manager”时，它将删除与通知和其他未扫描的翻译有关的所有关键亲戚。

这是我的问题：是否有任何方法可以“说”“ react-intl-translations-manager”禁止删除这些键？

我尝试了多种解决方案，包括白名单和其他解决方案，但无济于事。

这是我的translationRunner.js（配置文件）

const manageTranslations = require('react-intl-translations-manager').default;

 manageTranslations({
    messagesDirectory: 'src/messages/',
    translationsDirectory: 'src/locales/',
    languages: ['en_GB', 'fr_FR']
 });

Answer 1

有两种方法可以做到这一点。一种是使用挂钩，另一种方式是覆盖发生实际代码删除的模块。

要做同样的事情，我们可以覆盖getLanguageReport中的react-intl-translations-manager/dist/getLanguageReport模块

getLanguageReport = require('react-intl-translations-manager/dist/getLanguageReport');
getLanguageReport.original = getLanguageReport.default
getLanguageReport.default = function(defaultMessages, languageMessages, languageWhitelist) {
    data = getLanguageReport.original(defaultMessages, languageMessages, languageWhitelist)
    // this whitelist ids can be read through a config file as well
    whitelisted_id = ['helloworld2', 'helloworld']
    deleted = data.deleted;
    re_add = []
    for (var i=0; i < deleted.length; ) {
        if (whitelisted_id.indexOf(deleted[i].key)>=0) {
            // we are removing a record so lets not increment i
            removed_element = deleted.splice(i,1)[0];
            data.fileOutput[removed_element.key] = removed_element.message;
        } else {
            i++;
        }
    }
    return data;
}
 const manageTranslations = require('react-intl-translations-manager').default;


manageTranslations({
    messagesDirectory: 'build/messages/src/extracted/',
    translationsDirectory: 'src/translations/locales/',
    languages: ['de'] // Any translation --- don't include the default language
}
);

此方法可以正常工作，即使新代码中不存在helloworld2消息，也可以保留。

挂钩方法

在此，我们使用钩子reportLanguage并将其覆盖以更改数据

const manageTranslations = require('react-intl-translations-manager').default;
const writeFileSync = require('fs').writeFileSync
const stringify = require('react-intl-translations-manager/dist/stringify').default;

stringifyOpts = {
    sortKeys: true,
    space: 2,
    trailingNewline: false,
  };

manageTranslations({
    messagesDirectory: 'build/messages/src/extracted/',
    translationsDirectory: 'src/translations/locales/',
    languages: ['de'], // Any translation --- don't include the default language
    overrideCoreMethods: {
        reportLanguage: function(langResults) {
            data = langResults.report;
            // this whitelist ids can be read through a config file as well
            whitelisted_id = ['helloworld2', 'helloworld']
            deleted = data.deleted;
            re_add = []
            for (var i=0; i < deleted.length; ) {
                if (whitelisted_id.indexOf(deleted[i].key)>=0) {
                    // we are removing a record so lets not increment i
                    removed_element = deleted.splice(i,1)[0];
                    data.fileOutput[removed_element.key] = removed_element.message;
                } else {
                    i++;
                }
            }
            // original definition of reportLanguage from manageTranslations.js
            // unfortunately the original core method is not exposed for us to re-use
            // so we need to copy the code again
            if (
                !langResults.report.noTranslationFile &&
                !langResults.report.noWhitelistFile
              ) {
                // printers.printLanguageReport(langResults);

                writeFileSync(
                  langResults.languageFilepath,
                  stringify(langResults.report.fileOutput, stringifyOpts)
                );
                writeFileSync(
                  langResults.whitelistFilepath,
                  stringify(langResults.report.whitelistOutput, stringifyOpts)
                );
              } else {
                if (langResults.report.noTranslationFile) {
                  printers.printNoLanguageFile(langResults);
                  writeFileSync(
                    langResults,
                    stringify(langResults.report.fileOutput, stringifyOpts)
                  );
                }

                if (langResults.report.noWhitelistFile) {
                  printers.printNoLanguageWhitelistFile(langResults);
                  writeFileSync(
                    langResults.whitelistFilepath,
                    stringify([], stringifyOpts)
                  );
                }
            }     
        }
    }
});

如何不使用“ react-intl-translations-manager”删除现有翻译？

1 个答案: