How to use environment variable in import syntax?

Question

I am using angular v5. I want to do something like

import { OwnedSetABI } from 
`../constant/${environment.envName}/OwnedSetContractABI`;

I have OwnedSetContractABI file in different folder and want to use then according to environment. for example for dev env the path of OwnedSetABI would be '../constant/dev/OwnedSetContractABI', for production env the path of OwnedSetABI would be '../constant/production/OwnedSetContractABI'. But ES6 not allowd to use variable in import syntax. How I can achieve this scenario?

Fateh Mohamed · Accepted Answer · 2019-01-25 09:34:05Z

2

i think you can define multiple configurations inside your angular.json

     "production": {
     "fileReplacements": [
            {
              "replace": "src/environments/environment.ts",
              "with": "src/environments/environment.prod.ts"
            }
          ]
     },
     "dev": {
         "fileReplacements": [
            {
              "replace": "src/environments/environment.ts",
              "with": "src/environments/environment.dev.ts"
            }
          ]

     }

and in each environment file you can import a specific OwnedSetABI from different directories environment.prod.ts

export * from './prod/OwnedSetContractABI';

so you have just import that way

import {environment} from '../environments/environment';

and run build and serve for the wanted configuration dev or prod

ng build --env=production

or

ng serve --env=production

edited Jan 25, 2019 at 9:34

answered Jan 25, 2019 at 9:28

Fateh Mohamed

21.5k5 gold badges46 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Francisco Santorelli · Accepted Answer · 2019-01-25 09:23:05Z

0

Check your angular.json and ctrl + f for "fileReplacements" and there you should see the answer you look for.

In short, you tell angular what to replace environment.ts with, depending on environment.

Any env-dependant variables put them in those environment files with the same variable name, and they would automatically be replaced on serve or build.. and then just import those in environment.ts (the one that is bound to be replaced)

answered Jan 25, 2019 at 9:23

Francisco Santorelli

1,3589 silver badges13 bronze badges

Comments

Arun Selvaraju · Accepted Answer · 2023-10-09 06:50:51Z

0

I solved this problem by replacing import statement with require statement. Try replacing

import { OwnedSetABI } from 
`../constant/${environment.envName}/OwnedSetContractABI`;

with

const OwnedSetABI = require(`../constant/${environment.envName}/OwnedSetContractABI`);

Thanks.

answered Oct 9, 2023 at 6:50

Arun Selvaraju

1

Collectives™ on Stack Overflow

How to use environment variable in import syntax?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related