I want to use environmental variables in my angular project to hide sensitive information. I have followed this tutorial using dotenv https://javascript.plainenglish.io/setup-dotenv-to-access-environment-variables-in-angular-9-f06c6ffb86c0 but I can't seem to get any value from my process.env. I can't figure out why or how.
setenv.ts file
const { writeFile } = require('fs');
const { argv } = require('yargs');
// read environment variables from .env file
require('dotenv').config();
// read the command line arguments passed with yargs
const environment = argv.environment;
const isProduction = environment === 'prod';
const targetPath = isProduction
? `./src/environments/environment.prod.ts`
: `./src/environments/environment.ts`;
if (!process.env.API_KEY || !process.env.ANOTHER_API_KEY) {
console.error('All the required environment variables were not provided!');
process.exit(-1);
}
// we have access to our environment variables
// in the process.env object thanks to dotenv
const environmentFileContent = `
export const environment = {
production: ${isProduction},
APP_ID: "${process.env.APP_ID}",
API_KEY: "${process.env.API_KEY}"
};
`;
// write the content to the respective file
writeFile(targetPath, environmentFileContent, function (err) {
if (err) {
console.log(err);
}
console.log(`Wrote variables to ${targetPath}`);
});
package.json
"ng": "ng",
"config": "npx ts-node ./scripts/setenv.ts",
"start": "npm run config -- --environment=dev && ng serve",
"build": "npm run config -- --environment=prod && ng build",
.env
APP_ID=myAppId
API_KEY=myApi_Key
CodePudding user response:
I believe your path is wrong. The way I do it is import environment at the top of the document, for example, with a relative path from src/app/services/api.service.ts to src/enviroments/environment.ts:
import { environment } from '../../environments/environment';
And then just extract values you need:
BACKEND_URL = environment.apiUrl;
CodePudding user response:
I suspect you don't have the .env file in the right place. Can you try this
require('dotenv').config({ path: '/custom/path/to/.env' })
See here https://www.npmjs.com/package/dotenv