如何在本机反应中使用诸如 moment.js 之类的 javascript 库

Posted 2023-02-16

【中文标题】如何在本机反应中使用诸如 moment.js 之类的 javascript 库

【英文标题】：How can I use javascript library such as moment.js in react native

【发布时间】：2015-05-31 11:53:42

【问题描述】：

在 react native 中使用原生 javascript 库的推荐方法是什么？有什么具体的限制吗？

【参考方案1】：

简单易懂！从项目的根目录运行：

npm install moment --save

然后你可以在你的代码中导入它：

import moment from 'moment';
var now = moment().format();

限制将是任何试图“接触”浏览器的东西（在此上下文中不存在）。这就是 XHR 之类的 polyfill 的原因。

official documentation 有关于如何使用矩库的示例

【讨论】：

这看起来并不实际。与 lodash 相同。有些东西有效，例如通量包，有些则无效。

我已经尝试过了，它确实有效。具体问题是什么？

你试过其他的吗，比如lodash？它对我都不起作用。从require('lodash') 导出的模块是一个空对象。我也尝试过“lodash-node”。

看起来其他人也在报告同样的事情：github.com/facebook/react-native/issues/406

只是我在 loadash 问题上的 2 美分，而且我是菜鸟，所以不要相信我的话，但在 React Native 中，一些库需要依赖于操作系统的代码，即在 xcode 或 android 中。我对此了解的还不够多，无法进一步评论。另一个想法是 Import 语句默认在 node_modules 文件夹中查找，而与 package.json 无关。您的导入语句也可能是错误的。您也可以尝试变体： import func from 'lib' 或 import * from 'lib'

【参考方案2】：

一些即时方法在 React Native 中有效，而另一些则无效。我怀疑这与听众有关。

我可以使用 moment 进行格式化：

moment(new Date()).format("YYYY-MM-DD hh:mm:ss")

但不适用于主动格式化：

moment(new Date()).format("YYYY-MM-DD hh:mm:ss").fromNow()

【参考方案3】：

要使用 npm 库，只需将此命令与相应的库名称一起使用

npm install moment --save

eg.) npm install your library name here --save

然后在你的类中导入并使用

import moment from 'moment';

【参考方案4】：

如果你特别想在 react 或 react native 中使用 moment.js，请查看 react-moment，这是一个用于 moment 库的 react 组件，位于 https://github.com/headzoo/react-moment。

要在 react native 中使用 react-moment，运行：

npm install --save moment react-moment

然后在你要使用moment的文件中：

import Moment from 'react-moment';

最后，随意使用，例如：

<Moment element=Text fromNow>
     post.datePublished 
</Moment>

prop element=Text 专门用于 React Native。它确保生成的字符串在Text 组件中呈现。没有这个，react native 会报错。

【讨论】：

element=Text 这个东西解决了我的错误。谢谢！！

【参考方案5】：

目前看来，一些npm modules are not compatible with the packager。还没有真正深入研究为什么，但我一直在做的是拥有一个供应商文件夹并复制网络版本，但在顶部专门放置

/** * @providesModule moment */

并在底部将其更改为：

module.exports = moment;

不确定这是否正确，但包装对每个人来说还是很新的。