repack
repack copied to clipboard
RePack with rn_nodeify
Hi, I've been trying to add rn_nodeify library available in my rePack project but it's not working
What rn_nodeify does:
It provides your react-native project with core nodeJs modules
How it works:
It recurses down node_modules and modifies all the package.json's in node_modules to add/update the browser and react-native entry fields and it does it in the post-install script when yarn is ran
Adding rn_nodeify
After adding rn_nodeify, it adds only the library stated in the postinstall script -
"postinstall": "./node_modules/.bin/rn-nodeify --hack --install crypto,stream,process,events,vm-browserify",
which are the library needed for cryptoJs to work yielding the below
"dependencies": {
"events": "^1.1.1",
"process": "^0.11.10",
"react": "18.2.0",
"react-native": "0.72.5",
"react-native-crypto": "^2.2.0",
"react-native-randombytes": "^3.6.1",
"readable-stream": "^1.0.33",
"rn-nodeify": "^10.3.0",
"stream-browserify": "^1.0.0",
"vm-browserify": "^0.0.4"
},
By default, it maps all these modules to the browser and react-native fields, In my case
"react-native": {
"crypto": "react-native-crypto",
"_stream_transform": "readable-stream/transform",
"_stream_readable": "readable-stream/readable",
"_stream_writable": "readable-stream/writable",
"_stream_duplex": "readable-stream/duplex",
"_stream_passthrough": "readable-stream/passthrough",
"stream": "stream-browserify"
},
"browser": {
"crypto": "react-native-crypto",
"_stream_transform": "readable-stream/transform",
"_stream_readable": "readable-stream/readable",
"_stream_writable": "readable-stream/writable",
"_stream_duplex": "readable-stream/duplex",
"_stream_passthrough": "readable-stream/passthrough",
"stream": "stream-browserify"
}
It also generates and adds shim.js to the root of the project which is in turn imported in the entry point of the project, index.js Shim.js populates some necessary nodeJs module
if (typeof __filename === 'undefined') global.__filename = '';
if (typeof process === 'undefined') {
global.process = require('process');
} else {
const bProcess = require('process');
for (var p in bProcess) {
if (!(p in process)) {
process[p] = bProcess[p];
}
}
}
process.browser = false;
if (typeof Buffer === 'undefined') global.Buffer = require('buffer').Buffer;
// global.location = global.location || { port: 80 }
const isDev = typeof __DEV__ === 'boolean' && __DEV__;
process.env['NODE_ENV'] = isDev ? 'development' : 'production';
if (typeof localStorage !== 'undefined') {
localStorage.debug = isDev ? '*' : '';
}
Installation Aftermath
After all the above steps, it works perfectly with metro but with repack, fistly I had to edit webpack config because I got an invariant cannot be resolved in all the modules, react native included
After adding this, that error was resolved
modules: [
path.resolve(dirname, 'node_modules'),
'node_modules',
'invariant',
'browserify-sign',
],
Latly, in the shim.js, I cannot log the process library but I can log its typeof which is an object (ehereas in metro I can do both)
Also I removed this -
process.env['NODE_ENV'] = isDev ? 'development' : 'production'
because I was getting lefthand side assignment error probably because process.env['NODE_ENV'] was likely undefined
Everything works fine with metro but not repack, please any suggestion on what I can I do. Thanks
I also tried everything under this issue to no avail - Issue 296
This is a reproducible repo for the rn_nodeify implementation which includes =>
- A fresh installation of react native v 0.72.5 with repack integrated
- rn_nodeify installed with a post install script to install only the nodeJs modules needed
- and encryption and decryption code with its use
https://github.com/vlack-coder/nodifypack
To run with webpack
yarn start
To run with metro
yarn starter
Hi @vlack-coder,
I'll take a look at this when I have some spare time, since it's using rn_nodeify it's a very low priority.
May I ask what do you need it for?
This issue has been marked as stale because it has been inactive for 30 days. Please update this issue or it will be automatically closed in 14 days.
This issue has been automatically closed because it has been inactive for more than 14 days. Please reopen if you want to add more context.