根據需求加載模塊

Question

我使用Browserify與Babel和Gulp。 目前我的項目只需要很少的部分lodash，我不想加載整個模塊。

import assignIn from 'lodash/assignin'; 
import isPlainObject from 'lodash/isplainobject'; 
import isFunction from 'lodash/isfunction'; 

上面的代碼工作正常，但有點耗時，我不得不重複指定整個路徑。 不會是好，如果這是可以做到的：

import {assignIn, isPlainObject, isFunction} as _ from 'loadash'; 

，並以此爲_.assignIn。我也可以得到命名空間_。 我做錯了什麼是另一種做法或這是唯一的方法。

Answer 1

如果您可以使用babel-plugin-lodash插件，它幾乎可以滿足您的需求。

相反的：

import assignIn from 'lodash/assignin'; 
import isPlainObject from 'lodash/isplainobject'; 
import isFunction from 'lodash/isfunction'; 

你可以使用：

import _ from 'lodash'; 

，並從browserify輸出將被改造。

例如：

import _ from 'lodash'; 

function Foo() { 
    this.a = 1; 
} 

Foo.prototype.b = 2; 

_.assignIn({ 'a': 0 }, new Foo); 

_.isPlainObject({}); 

_.isFunction(/abc/); 

無插件：

var _lodash = require('lodash'); 

var _lodash2 = _interopRequireDefault(_lodash); 

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 
... 

與插件：

var _isFunction2 = require('lodash/isFunction'); 

var _isFunction3 = _interopRequireDefault(_isFunction2); 

var _isPlainObject2 = require('lodash/isPlainObject'); 

var _isPlainObject3 = _interopRequireDefault(_isPlainObject2); 

var _assignIn2 = require('lodash/assignIn'); 

var _assignIn3 = _interopRequireDefault(_assignIn2); 

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 
...