How to pass Node environment variables to React Native JS code - javascript

I am trying to access node environment variable from JS code of React Native, but somehow whatever I pass it is not used.
If I try something like:
NODE_ENV=test react-native run-android
I expect process.env.NODE_ENV to be equal to test however it is overwritten to production or development according to the __DEV__ param of the bundle request.
What is the suggested way of passing environment variables to JS code in React Native?
Thanks

I'm sure you have probably have moved on from this (5 months later), but I'll answer it incase anyone else has found themself here.
At best you'll set an env var in that react-native process which won't even set it in the packager. However, that doesn't seem like what you want. You want, if I understand correctly, to have access to that variable in your app code. The reason you can't do that by setting a variable that way is that node isn't running your app, it's just packaging it and it's being run in a chrome webworker (in remote dev mode) or WebKit (in the case of on device).
To do what you want, see here
To read more about the JS environment, read here

Related

Components are accessable via console on production?

I recently deployed a website for a friend of mine, written in React, Express, Mongodb, etc... And I can see that I have a console.log on one of the components and wanted to ask if that's normal that a component is accessible via a console.log? (I can access the source code because of that).
And is there a solution for that or just removing ALL console.log before production?
Assuming you used create-react-app to start the project, it generates sourcemaps when you run the build script by default. You can disable this by adding GENERATE_SOURCEMAP=false in your .env file.
As for the console logs, you can either change console.log to console.debug (which only shows in the browser console when you have verbose logging enabled) or you can rely on some linting rule (like this) to prevent the use of console altogether.

IBM Informix driver for NodeJS - Setting environment variables on MacOS

This is a follow on to my original question
I am trying to set up IBM's Informix driver for use with NodeJS on MacOS.
After viewing the Readme file for the Informix NPM library, I am a little confused as to what the environment variables are and whether I need to apply them all?
I managed to track down the install location for the SDK files: Applications/IBM/informix and then added this to the ~/.bash_profile file as so:
export INFORMIXDIR=/Applications/IBM/informix
export PATH=$PATH:$INFORMIDIR
Should I change my PATH to include /bin at the end?
I am also confused by the remainder of the statements in the Readme.
I was expecting to set the server name and host dynamically rather than hard-coding them?
Some guidance would be appreciated.
The PATH env variable needs $INFORMIXDIR/bin. (There is nothing in plain $INFORMIXDIR worth running other than the install script).
INFORMIXSERVER and INFORMIXSQLHOSTS may be needed for testing the module, but they are not hardcoded (the module will not store that anywhere)
You will always be able to specify a different INFORMIXSERVER/INFORMIXSQLHOSTS at runtime.
I never tried it on a MacOS, but you may also need to add DYLD_LIBRARY_PATH, something like "export DYLD_LIBRARY_PATH=$LD_LIBRARY_PATH" to your script.
Some MacOS binaries will use DYLD_LIBRARY_PATH instead of LD_LIBRARY_PATH.

Can't profile Babel-transpiled Node.js app with Spy-js in WebStorm

So me and my team are currently in the process of profiling our Node.js app to try and improve performance on it as much as we can. After doing it with Chrome's DevTools for Node.js which was not excruciatingly hard to achieve, I thought of giving Jetbrains' Spy-js a try and so far I've had no luck.
The app is run from inside a Docker container, and the code is transpiled with babel-cli on the fly so this surely complicates things a bit. Even though I could probably get it working outside Docker and somehow connect it to the other containers, I could not go as far as to try that since I haven't managed to run the app with Spy-js.
Spy-js differs from DevTools in that it doesn't just connect with the app through the native inspector's debugging port, but rather requires the app to be run from the tool so that it can also intercept and modify script execution on the fly (as per their docs).
Since I'm using babel-node to run the app, I've tried creating a new Run/Debug configuration in WebStorm pointing to it (from a fresh global install of babel-cli) as the "Node interpreter" value in the options window. I've also already added all of the app's required environment variables to the options.
With the above setup, attempting to run the new Spy-js configuration results in the following errors:
Undefined handler Super
session (ak133): Error while instrumenting '<app directory here>/node_modules/p-locate/index.js'
(g is not a function)
session (ak133): Unexpected identifier
<app directory here>/node_modules/boom/lib/index.js:249
constructor(message, options undefined {}) {
^^^^^^^^^
Which looks like it's having trouble transpiling dependencies (boom). The original source for this was options = {} so I'm not sure why it would be converted to that either.
As much as I know this is not officially supported yet, I'd really appreciate being able to get it running somehow as Spy-js seems to do its own thing and isn't just another wrapper for the native v8 profiler, so any help would be appreciated.
Try using -r babel-register instead of babel-node - does it make things any better?
Of course, you need adding .babelrc to your project, like
{
"presets": ["env"]
}

Why vue acts differently with Laravel than standalone vue app?

I don't know why Vue acts differently with Laravel than standalone Vue app. Maybe I can't understand the environment it needs to work correctly. Here is what's happening which made me post this question.
When I install standalone Vue app, Let's say, when I install it in a completely different directory using vue init webpack vueapp, It works as it should. When I update anything in .vue file, It gets updated in the browser too which is expected behaviour in my mind or maybe it's because I am executing it in a development environment using npm run dev.
But when I use vue with laravel, I can load the modules and I can see loaded modules in the browser, but when I update something a component, It won't update in the browser! It just does not. I have to reload a page every time I update markup in the component file.
Also, when I execute npm run dev in the vue app with Laravel, It does not take over the terminal as it does in the standalone vue app. It is obvious as we can't execute vue as well as laravel in the same development environment as vue uses nodejs which uses the port 8080 and apache uses the port 80.
I don't know what I am missing but it's eating my head since last few days. I surfed almost all the tutorials available on the internet and all the available StackOverflow questions but still, I can't get it! I think it's the normal behaviour but I have less experience with vue.js as I am a newbie in vue.js.
Any help would be appreciated!
What you are saying is true and it was meant to be that way.
But you can use a library that comes withlaravel to accomplish that. first.
add .browserSync(); to your webpack.mix.js
instead of npm run dev use npm run watch. This will help you not to refresh.
and that is how you have the same effect. Hope its not much.

Passing Environment Variable to React Native Main File

I'd like to get in my RN app a variable from the environment somehow.
I've tried few things like: MY_VAR=foo node... this doesn't pass my JS file
I've tried using the --root option in RN CLI but this doesn't give me a complete solution as when using xcode to actually run the code with the bundler, they run, hard-coded index.js
What are my options?
I need to know somehow - where this code runs - which for it, to my understanding i need to pass some environment variable somehoe
It depends on the method you create your RN app, but here are the options for both:
if using react-native init:
react-native-config, it's an easier set up than so far what i read.
-setup .env.dev and a few others you want. yarn add react-native config, set up using gradle, IOS has another method so read through the documents. then run ENVFILE=.env.dev react-native run-ios
create-react-native-app:
You may have the webpack, which means it would help you.
If you decided to eject your app from create-react-native-app, please go with react-native-config.
https://webpack.js.org/plugins/environment-plugin/
Good luck!

Categories