Question

我尝试在我的本机应用中使用节点模块，并且我在这里采用了ReactNativify方法。

我现在都已经设置了，我得到了加密包，可以正常加载。然而，当我加入eth-lightwallet时，事情变得越来越奇怪。

自从我添加了这个包之后，npm还没有安装任何依赖项。意思是我必须手动添加它们。每次我安装一个与eth-lightwallet相关的依赖项时，该模块都会被卸载。虽然单调乏味且烦人，但我希望它可以解释我当前的问题。

现在我遇到了Can't find variable: Buffer，它被抛入标准库的util文件夹中。我查看了代码并从全局命名空间访问了Buffer。事实上，我正在将Buffer导入全局命名空间。在这里看看我的global.js

// Inject node globals into React Native global scope.
global.Buffer = require('buffer').Buffer;
global.process = require('process');
global.process.env.NODE_ENV = __DEV__ ? 'development' : 'production';

// Needed so that 'stream-http' chooses the right default protocol.
global.location = {
    protocol: 'file:',
};

// Don't do this in production. You're going to want to patch in
// https://github.com/mvayngrib/react-native-randombytes or similar.
global.crypto = {
    getRandomValues(byteArray) {
        for (let i = 0; i < byteArray.length; i++) {
            byteArray[i] = Math.floor(256 * Math.random());
        }
    },
};

我的猜测是在加载此全局变量之前正在评估标准库，因此会抛出错误。

Answer 1

在TypeScript中，我必须显式导入Buffer。

import { Buffer } from "buffer"

我希望编译器会抱怨Buffer在导入之前丢失，并且/或者"source.organizeImports": true在保存文件时会删除该行，但都不是。

@ehacinom的解决方案也有效。

Answer 2

回到此处留下解决方案以防万一有人坚持这一点。解决方案是基本上尝试在不同的时间内在不同的包中填充以改变加载顺序。

当TYPED_ARRAY_SUPPORT被区别对待时，我们尝试回到不同的版本，而Buffer更依赖于它。虽然在旧版本上我们尝试了很多不同的东西，最终放弃并通过更新缓冲区到最新版本回溯，最后一切都有效。

我的意思是说我们不确定我们是如何解决它的，但是通过随机改变加载顺序直到我们幸运为止。我不清楚，但我能为这个问题提供最好的答案。

这是我们的global.js最后的样子

// Inject node globals into React Native global scope.
// Required for crypto functionality for bitcoinjs-lib, web3, etc.

global.Buffer = require('buffer').Buffer;
//global.Buffer.TYPED_ARRAY_SUPPORT = false;

global.process = require('process');
global.process.env.NODE_ENV = __DEV__ ? 'development' : 'production';

var getRandomValues = function(byteArray) {
  var bytes = crypto.rng.randomBytes(byteArray.length);
  for (let i = 0; i < byteArray.length; i++) {
    byteArray[i] = bytes[i];
  }
};
// "But Zach, aren't you just doing the same thing twice?"
// Yes. Initializing the crypto-browserify module eventually requires
// crypto.getRandomValues to exist, so we must add it here once.
// However, crypto-browserify does not support getRandomValues, so we
// must re-add it after loading the module.
global.crypto = { getRandomValues };
global.crypto.rng = require('react-native-randombytes');
global.crypto = require('crypto');
global.crypto.getRandomValues = getRandomValues;
global.crypto.rng = require('react-native-randombytes');
crypto.rng.seedSJCL();

// Needed so that 'stream-http' chooses the right default protocol.
global.location = {
  protocol: 'file:'
};

Answer 3

我运行了npm install buffer，并将其放在需要Buffer的文件的顶部：

global.Buffer = global.Buffer || require('buffer').Buffer

Answer 4

首先安装以下内容

yarn add buffer process babel-plugin-react-native-nodeify-hack

然后将其添加到babel设置.babelrc

{
  "presets": ["react-native"],
  "plugins": ["babel-plugin-react-native-nodeify-hack"]
}

手动导入缓冲区和处理模块。在您的index.ios.js和index.android.js中，将其添加到第一行：

import process from 'process';
import buffer from 'buffer';
global.Buffer = buffer.Buffer

尝试停止正在运行的React Native Packager，然后运行：

rm -rf $TMPDIR/react-*

然后重新启动

你很好！

Answer 5

我正在使用rn-nodeify将节点程序包用于我的react-native项目中。添加后安装脚本

    "postinstall": "./node_modules/.bin/rn-nodeify --install buffer,events,process,stream,util,inherits,fs,path,assert --hack;"

我仍然遇到找不到变量：缓冲区。最后我通过将shim.js文件导入到我的App.js中解决了这个问题：

import './shim';

希望有帮助！祝您黑客愉快。

无法找到变量：缓冲区

5 个答案: