10
import utilityRemove from 'lodash/array/remove';
import utilityAssign from 'lodash/object/assign';
import utilityRandom from 'lodash/number/random';
import utilityFind from 'lodash/collection/find';
import utilityWhere from 'lodash/collection/where';

let util;

util = {};

util.remove = utilityRemove;
util.assign = utilityAssign;
util.random = utilityRandom;
util.find = utilityFind;
util.where = utilityWhere;

Is there a better way to do the above using ES6 module system?

Gajus
  • 69,002
  • 70
  • 275
  • 438
  • I really wonder why you are not doing `import util from 'lodash'` or `import {remove, assign, random, find, where} from 'lodash'`? – Bergi Aug 20 '15 at 17:55
  • Both approaches would import the entire library (600KB). Importing individual modules adds up to only about 80KB. – Gajus Aug 20 '15 at 18:00
  • Are you re-exporting `util` or using it inside this same file. If you are re-exporting it, then you should use ES6 syntax to do that and skip making an object entirely. – loganfsmyth Aug 20 '15 at 18:01
  • Just use a [next-generation bundler](https://github.com/rollup/rollup#a-better-approach) then :-) – Bergi Aug 20 '15 at 18:02
  • @Bergi Thats very nice. You should reach out to people at Babel, if you haven't already. – Gajus Aug 20 '15 at 18:08
  • @GajusKuizinas: It's not my project, but it looks promising indeed :-) There seems to be a [babel integration](https://github.com/rollup/rollup-babel) already available – Bergi Aug 20 '15 at 18:09

2 Answers2

5

If these are the only symbols in your module, I would shorten the names and use the new object shorthand to do:

import remove from 'lodash/array/remove';
import assign from 'lodash/object/assign';
import random from 'lodash/number/random';
import find from 'lodash/collection/find';
import where from 'lodash/collection/where';

let util = {
  remove,
  assign,
  random,
  find,
  where
};

If that could cause conflicts, you might consider moving this section to its own module. Being able to replace the lodash methods while testing could potentially be useful.

Since each symbol comes from a different module, you can't combine the imports, unless lodash provides a combined import module for that purpose.

If you're simply exporting a symbol without using it, you can also consider this syntax:

export remove from 'lodash/array/remove';
export assign from 'lodash/object/assign';

Which, to anyone importing and using your module, will appear as:

import {remove, assign} from 'your-module';
ssube
  • 47,010
  • 7
  • 103
  • 140
  • That will not work because there is a built in global variable `window.find`. If you are using ESLint and have "no-redeclare" rule enabled, it will produce an error. – Gajus Aug 20 '15 at 17:41
  • Then you can just change one import: `import loFind from ...; let util = {remove, assign, random, find: loFind, ...};` – ssube Aug 20 '15 at 17:42
  • 1
    I realise this is an option, but I am raising this more as a design issue than anything else. I don't expect a satisfactory answer given the current ES standard. It is shame something like this is impossible, https://gist.github.com/gajus/d1fe16bc9605799cce5e. – Gajus Aug 20 '15 at 17:45
  • @GajusKuizinas: But the module you're importing into is not global? There is no collision. – Bergi Aug 20 '15 at 17:54
  • @GajusKuizinas Added an example of the export forwarding syntax. Will that help you? – ssube Aug 20 '15 at 17:56
  • 3
    @GajusKuizinas: *"I am raising this more as a design issue than anything else. I don't expect a satisfactory answer given the current ES standard."* Then Stack Overflow is not the right place for a discussion like this. – Felix Kling Aug 20 '15 at 17:57
  • 1
    @GajusKuizinas: *"If you are using ESLint and have "no-redeclare" rule enabled, it will produce an error."* Then maybe you want to disable that rule for that file / line, if it's an intentional override. – Felix Kling Aug 20 '15 at 17:58
  • @FelixKling Serious question. Is it part of your job to be active on stack overflow? Because that'd be an awesome job. – Gajus Aug 20 '15 at 18:09
  • Making linting exceptions is an indication of code smell or bad linting rule. In this case, the rule is fine: it does what it is expected to do – prevent overwriting/masking variables present in the global scope. If I did not have OCD, I would not have this rule enabled in the first place. – Gajus Aug 20 '15 at 18:11
  • @GajusKuizinas: Well, there are always exceptions to rules. I wouldn't say it's code smell, especially in this case, since you cannot completely control the global environment. And no, it's not part of my job ;) – Felix Kling Aug 20 '15 at 18:13
  • @GajusKuizinas: In this case I'd vote for bad linting rule. It's just too strict to be useful, especially if all global variables are considered. While overwriting might not be a good idea, there's nothing wrong with shadowing them; otherwise it's restricting development - there are just [too many unsafe names](http://www.jibbering.com/faq/names/unsafe_names.html), not even considering the [dynamic ones](http://stackoverflow.com/q/3434278/1048572). – Bergi Aug 20 '15 at 18:21
3

You can do this in a utils module:

//utils.js

export remove from 'lodash/array/remove';
export assign from 'lodash/object/assign';
export random from 'lodash/number/random';
export find from 'lodash/collection/find';
export where from 'lodash/collection/where';

and use it like this:

import * as util from './utils';

...

util.random();
Gabriel McAdams
  • 56,921
  • 12
  • 61
  • 77