Variables in .env file is not updated. How to reset - javascript

Im building an app with Quasar (vue) where I am using .env file to store my keys to the database. I was going to switch to another instance but after I changed the keys in the env file it still calls the old values of the variables. They seemd to be cached in some way.
Im using dotenv to call the env file.
I have tried of course to reset the history in browser as well as running
npm cache clean --force
How can I reset the env files?

Quasar handles env variables through quasar.config.js file, not separate .env files. See the documentation.
quasar.config.js
module.exports = function (ctx) {
return {
// ...
build: {
// passing down to UI code from quasar.config.js
env: {
API: ctx.dev
? 'https://dev.api.com'
: 'https://prod.api.com'
}
}
}
}
As noted in the docs, if you do want to use .env files you'll have to add the dotenv package to your project and point quasar.config.js to use the env variables set with dotenv
build: {
env: require('dotenv').config().parsed
}

Related

process.env variables undefined React App - Not using create-react-app

I have a custom React app, and it's not using create-react-app. Problem is I can use dotenv and environment variables locally via .env file but when in production process.env is undefined entirely.
I don't know how to get it working. I've added the environment variables to my server in Google Cloud but process.env itself is not even defined, the same code that worked locally does not work on a virtual prod server.
So for example something like this works locally but not in production:
if (process.env.NODE_ENV === 'development') {
response = await request.post(process.env.GRAPHQ_LOCAL).send(query);
} else {
response = await request.post(process.env.GRAPHQL_PROD).send(query);
}
Your project starter file add dotenv init...
if you install this package, should be work
require('dotenv').config()

How can I set production build path in vue-cli?

I'm using the vue-cli tool to develop vuejs apps, and I'm developing a server too, so i want to build the /dist folder in my server to send it to the browser as static, but I don't even know where the /dist folder is.
There is a webpack.prod.config.js file (I think is the webpack config for production) and in the path-output field I tried to wirte the path but didn't work.
/dist is just a default setting by VueJS. If you want to modify this : as the documentation from VueJS states :
Always use outputDir instead of modifying webpack output.path.
Create a vue.config.js as an optional config file that will be automatically loaded by #vue/cli-service if it's present in your project root (next to package.json).
The file should export an object containing options:
// vue.config.js
module.exports = {
// options...
}
As otheres already stated in the comments, use outputDir to specify the directory where the production build files will be generated in when running vue-cli-service build. Note the target directory will be removed before building (this behavior can be disabled by passing --no-clean when building).
// vue.config.js
module.exports = {
outputDir : ''
}

Environment variables - undefined

I want to use environment variables. I made a custom react app environment.
Everything is ok, the app runs properly, no errors. But the variables from .env file gives undefined and the process.env gives an empty object.
I added dotenv and REACT_APP prefix to the variable.
And in webpack.config.js file i added node: { fs: 'empty' }, from here
Here are my configurations.
Folder structure:
PROBLEM SOLVED:
Uninstall dotenv
Remove these two from main app.js file:
const dotenv = require('dotenv')
dotenv.config();
Remove the flag --env from npm start script.
Remove node: { fs: 'empty' } from webpack.config.js file
Install dotenv-webpack, and follow the instructions from there.
No need for REACT_APP prefix.
Fixed configuration files
You have to put REACT_APP in front of the variable name you want to have
eg:/
REACT_APP_YOUR_VAR="something"
You don't need to install Dotenv or something else, because React has its own.
try https://www.npmjs.com/package/dotenv to use .env variables
In your entry JS file add below code snippet (maybe your ./src/assets/js/app.js)
const dotenv = require('dotenv')
dotenv.config()
and restart your app.
You can use webpack.DefinePlugin
plugins: [
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': JSON.stringify('development')
}
})
],
Then in your code simply use process.env.NODE_ENV to access ENV variable

Nuxt JS env file

I'm using Nuxt JS 2.9.2, and am trying to use a .env file to load a unique encryption key, however, the following doesn't seem to pull the information from the env file, even after installing dotenv
env: {
encryption_key: process.env.ENCRYPTION_KEY || 'secret key 123'
}
The above code is inserted inside of my export default inside of the nuxt config js file, it always seems to load the secret key 123 rather than ENCRYPTION_KEY from the env file
Here are the steps to get this working:
First install dotenv with npm i -D dotenv
Next, make sure you have a .env file that looks something like:
ENCRYPTION_KEY="put your key here"
Finally, add the following to the top of your nuxt.config.js:
require('dotenv').config();
A word of caution
Please be aware that this will actually build your client code with ENCRYPTION_KEY in the source, so anyone could read it. If that isn't what you want, I'd recommend doing all of your encryption on the server.

How to run custom config file in node.js project

In a node.js project using express framework, usually config folder has 3 files:
config.json - runs in prod env
development.json - runs in dev env
staging.json - runs in stage env
I want to create another config file called example.json and run local dev environment using example.json instead of development.json when ever the code is run with a special environment variable process.env.LOCAL_PROD.
Is there a way to do this?
You can do this with node-config and I highly recommend it as it allows for multiple config files and even hostname based config files. It also supports multiple formats including .js configs not just .json, you can read more about the various setups for configuration files in the node-config wiki. I use it in almost all of my applications that require some configuration due to how easy it is to use.
Now if you don't want to use a package to handle this, then you can do it with just using require() since it can read and parse .json files as well as .js. The common environment variable to use when setting what environment the application is running within is named NODE_ENV.
let config
let env = process.env.NODE_ENV.toLowerCase()
if (env === 'production') {
config = require('./config.json')
} else if (env === 'staging') {
config = require('./staging.json')
} else if (env === 'dev') {
config = require('./development.json')
} else {
console.log('No configurable NODE_ENV detected, no config loaded')
}

Categories

Resources