2

因此，我在 Electron 中实施了一个项目，并希望在其中实施国际化。我有一个简单的组件，它使用react-intlFormattedMessage 和一个messages.js包含其消息描述的文件。我尝试按照文档中的教程使用 提取国际化消息@formatjs/cli，但是，即使它似乎运行正确，npm 脚本似乎也没有返回任何内容，就像它没有找到任何消息一样。我的配置和文件如下所示：

.babelrc

{
  "presets":  ["react-app"],
  "plugins": [
    [
      "react-intl",
      {
        "idInterpolationPattern": "[sha512:contenthash:base64:6]",
        "extractFromFormatMessageCall": true,
        "ast": true
      }
    ]
  ]
}

messages.js

import { defineMessage, defineMessages } from 'react-intl';

const scope = 'src.components.Test';

export default defineMessages({
  info: {
    id: `${scope}.info`,
    defaultMessage: 'Info'
  }
});

package.json

...
"scripts": {
    "serve": "react-scripts start",
    "start": "SET DEBUG=true && electron .",
    "lint": "eslint .",
    "lint:fix": "eslint --fix .",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "messages:extract": "formatjs extract --ignore=src/translations/* --out-file=src/translations/pt.json 'src/**/messages.js'",
    "messages:compile": "formatjs compile-folder --ast  src/translations src/compiled-translations"
  },
...
"devDependencies": {
    "@babel/cli": "^7.12.8",
    "@formatjs/cli": "^2.13.15",
    "babel-plugin-react-intl": "^8.2.21",
    "babel-preset-react-app": "^10.0.0",
    "electron": "^10.1.1",
    "eslint": "^6.6.0",
    "eslint-config-airbnb": "^18.2.0",
    "eslint-plugin-import": "^2.22.1",
    "eslint-plugin-jsx-a11y": "^6.4.1",
    "eslint-plugin-react": "^7.21.5",
    "eslint-plugin-react-hooks": "^4.2.0",
    "extract-react-intl-messages": "^4.1.1"
  }

现在，每当我运行提取脚本 ( messages:extract) 时，我得到的只是一个空的 json 对象。如果我做错了什么，有什么想法吗？谢谢！

4

2 回答 2

5

我遇到过同样的问题。

尝试更改'src/**/messages.js'为\"src/**/messages.js\"

对我来说，这种改变是有效的。

于 2021-03-17T09:08:17.143 回答
1

我不知道我是否有同样的问题，但对我来说发生的事情是 CLI 确实看到了消息，但没有写入任何 JSON 文件。我可以让它工作的唯一方法如下（在 package.json 中）。

package.json

...
scripts: {
  "translations:extract": "npm run translations:extract:internal -- \"src/**/*.ts*\" --out-file \"locales/en.json\" --id-interpolation-pattern '[sha512:contenthash:base64:6]'",
  "translations:extract:internal": "formatjs extract",
}
...

感觉有点hacky，但它确实完成了工作。如果你真的想弄脏，也可以只使用一行：

package.json

...
scripts: {
    "translations:extract": "node_modules/.bin/formatjs extract \"src/**/*.ts*\" --out-file \"locales/extracted/en.json\" --id-interpolation-pattern '[sha512:contenthash:base64:6]'"
}
...

以上需要将formatjs安装为项目依赖

于 2021-08-05T14:05:23.210 回答