Import into object?

Question

Let's start with an example:

import renewCreepLife from '../tasks/renew_creep_life';
import harvestEnergy from '../tasks/harvest_energy';
import pickupEnergy from '../tasks/pickup_energy';
import storeEnergy from '../tasks/store_energy';
import upgradeController from '../tasks/upgrade_controller';

const taskFuncs = {
    [Tasks.RENEW]: renewCreepLife,
    [Tasks.PICKUP_ENERGY]: pickupEnergy,
    [Tasks.HARVESTING]: harvestEnergy,
    [Tasks.STORING]: storeEnergy,
    [Tasks.UPGRADING]: upgradeController,
};

Is there any way to simplify this so that I'm not creating these pointless temporary variable names? Something like:

// incorrect but desired syntax
const taskFuncs = {
    [Tasks.RENEW]: import '../tasks/renew_creep_life',
};

N.B. each of those files is using export default function()

Answer 1

No. The import statement does not have a return value, so it can never be used to assign directly to a variable like that.

Additionally, import and export must be declared at the top level.

This is not possible with ES6 and likely will stay that way for the foreseeable future (ES2016+).

However, there is a HTML Module Loader spec being worked on which will allow you to load modules like:

System.import('../tasks/renew_creep_life')
.then(renewCreepLife => {

});

But since it's promise-based, you'll still not be able to just write it inline in an object like that.

If you want synchronous loading, NodeJS' require is probably the closest you'll get. There are browser implementations such as Webpack/Browserify/etc. which attempt to mimic the behaviour:

const taskFuncs = {
    [Tasks.RENEW]: require('../tasks/renew_creep_life').default
};