Android 设备需要 React-Native 和 Intl polyfill答案

【问题标题】：React-Native and Intl polyfill required on Android deviceAndroid 设备需要 React-Native 和 Intl polyfill
【发布时间】：2017-06-03 20:29:16
【问题描述】：

我最近更新了我的 Android Studio 和许多组件/sdk，从那时起 React-Intl 抱怨缺少 intl 库，尽管它之前工作正常。

我已经安装了intl polyfill，并将它导入到我的主文件App.js 的最顶部。我还从react-intl 导入localeData 并添加它。然后，我在IntlProvider 中呈现我的视图，指定locale 没有消息（我现在只使用FormattedNumber）

这是我的代码的简化版本：

import 'intl';
import { IntlProvider, FormattedNumber, addLocaleData } from 'react-intl';
import en from 'react-intl/locale-data/en';

addLocaleData(en);

[...]

render() {
    return (
        <IntlProvider locale="en">
            <Text>
                <FormattedNumber value={123} />
            </Text>
        </IntlProvider>
    )
}

我收到以下错误：

[React Intl] 格式化数字错误。 ReferenceError：没有语言环境数据尚未为此对象提供。

我不明白发生了什么。有人遇到同样的问题吗？

谢谢

【问题讨论】：

标签： javascript android react-native intl react-intl

【解决方案1】：

我没有从react-intl 导入语言环境数据，而是解决了从intl 导入polyfill 和语言环境数据的问题

安装intl

npm install intl

在应用的最顶部添加：

import 'intl';
import 'intl/locale-data/jsonp/en';

【讨论】：

谢谢你拯救了我的一生。
你如何做 addLocaleData 部分？只是忽略它？还是从 'int/locale-data/jsonp/es' 导入 es ？
如果我们事先不知道语言环境怎么办？例如我希望 Intl 的行为取决于手机语言。
@kunambi 我放弃了那个解决方案。
@CanPoyrazoğlu 你找到解决方法了吗？我们必须做很多工作才能将金额显示为区域设置的函数，这很烦人。

【解决方案2】：

请注意，现在只需在顶部执行 import 'intl'; 并仍然从 react-intl 加载语言环境数据即可。使用以下版本：

"intl": "^1.2.5",
"react-intl": "^2.2.2",

【讨论】：

【解决方案3】：

修改“build.gradle”

在android上，你可以修改/android/app/build.gradle里面的“build.gradle”文件。请记住，它不是 /android/app/gradle/build.gradle 中的文件。

然后，转到站点文件并搜索：

/** * JavaScriptCore 的首选构建风格。 * * 例如，要使用国际变体，您可以使用： *`def jscFlavor = 'org.webkit:android-jsc-intl:+'` * * 国际版本包括 ICU i18n 库和必要的数据 *允许使用例如`Date.toLocaleString` 和 `String.localeCompare` * 与 en-US 以外的语言环境一起使用时给出正确的结果。注意 * 此变体每个架构比默认值大约 6MiB。 */ def jscFlavor = 'org.webkit:android-jsc:+'

现在，修改最后一行，或者简单地将其注释掉并复制并粘贴上面类似的行。结果将是这样的：

【讨论】：

非常感谢，我终于解决了我的问题 :)