CODEWITHSUNDEEP
javascriptnpmecmascript-6import
executable
executable

Reputation: 180

Conditional ES6 import and export

How to write a nested if else for import and export in ES6. Here I have 2 files, production.js and development.js having separately keys for development code and production code and another file keys.js which imports and exports them as per the requirement.All 3 files lie in same directory.

Note, package.json says type : "module".

production.js

const keys = {
    GOOGLE_CLIENT_ID : process.env.GOOGLE_CLIENT_ID,
    GOOGLE_CLIENT_SECRET : process.env.GOOGLE_CLIENT_SECRET,
    mongoURI : process.env.MONGO_URI,
    cookieKey : process.env.COOKIE_KEY
}

export default keys;

development.js

const keys = {
    GOOGLE_CLIENT_ID : 'something.something',
    GOOGLE_CLIENT_SECRET : 'itisasecret',
    mongoURI : 'database',
    cookieKey : 'blabla',
}

export default keys;

keys.js

if(process.env.NODE_ENV === 'production'){
    
    /*This section throws error*/
    
    import keys from './production.js'
    export default keys
}
else{

    /*This section also throws error*/

    import keys from './development.js'
    export default keys
}

Upvotes: 0

Views: 3161

Answers (2)

Randy Casburn
Randy Casburn

Reputation: 14165

You don't have to write a nested if/else to dynamically import a module, but you do have to use the dynamic import syntax. The reasons for this is because the import statement only takes a single or double quoted string that is a path to the module to import. If you use the dynamic syntax using import() (looks like a function but isn't really) then within the parentheses you can put a string template literal to pull in the file you need.

The downside is that import() returns a Promise object that you have to deal with. But that isn't too difficult.

Here is your solution:

index.js

import keys from './keys.js';
console.log(keys);

production.js

const keys = { stuff: 'production' }
export default keys;

development.js

const keys = { stuff: 'development' }
export default keys;

keys.js

process.env.NODE_ENV = 'production';
let keys;
(async ()=>{
  try {
    keys = import( `./${process.env.NODE_ENV}.js`);
  } catch(err) {
    console.log(err);
  }
})();
export default await keys;

Note the use of the async code here to deal with the Promise object. Also the try/catch should always wrap an await statement in order to handle any Promise rejection.

Used in this manner, there is no requirement for if/else conditional logic.

Finally, a working repl to demonstrate this working. But, in order for this to work on the repl:

  1. On the right panel select the shell tab
  2. run this command in the shell: npx node@14 index.js

If you just hit the Run button at the top of the page it won't work and you'll see errors about import.

Working Example

Upvotes: 3

Emiel Zuurbier
Emiel Zuurbier

Reputation: 20934

Unfortunately it doesn't work that way. What you're describing is basically a dynamic import.

Import both key sets from both files.
Then create an object that maps the keys based on the NODE_ENV values.
Select the keys and export.

import productionKeys from './production.js'
import developmentKeys from './development.js'

const keys = {
  'production': productionKeys,
  'development': developmentKeys
};

const selectedKeys = keys[process.env.NODE_ENV];

export default selectedKeys;

Upvotes: 2

Related Questions