我有一个拉请求反馈下面,只是想知道哪种方式是导入lodash的正确方式?
你最好从'lodash/has'导入has ..对于早期版本 lodash (v3)本身就很重,我们应该只导入 一个特殊的模块/函数,而不是导入整个lodash 图书馆。不确定更新的版本(v4)。
import has from 'lodash/has';
vs
import { has } from 'lodash';
谢谢
我有一个拉请求反馈下面,只是想知道哪种方式是导入lodash的正确方式?
你最好从'lodash/has'导入has ..对于早期版本 lodash (v3)本身就很重,我们应该只导入 一个特殊的模块/函数,而不是导入整个lodash 图书馆。不确定更新的版本(v4)。
import has from 'lodash/has';
vs
import { has } from 'lodash';
谢谢
当前回答
Import has from 'lodash/has';更好,因为lodash在一个文件中保存了它所有的函数,所以与其在100k导入整个'lodash'库,不如只导入lodash的has函数,它可能是2k。
其他回答
我认为更干净的进口lodash的方式是这样的:-
import _ from 'lodash'
然后你可以使用任何你想要的,只要使用下划线,就像这样:-
_.has()
Import has from 'lodash/has';更好,因为lodash在一个文件中保存了它所有的函数,所以与其在100k导入整个'lodash'库,不如只导入lodash的has函数,它可能是2k。
如果你正在使用babel,你应该检查babel-plugin-lodash,它会挑选你正在使用的lodash的部分,更少的麻烦和更小的捆绑。
它有一些局限性:
你必须使用ES2015导入来加载Lodash 不支持Babel < 6 & Node.js < 4 不支持链序列。请参阅这篇博客文章以获得替代方案。 不支持模块化的方法包
您可以导入它们为
import {concat, filter, orderBy} from 'lodash';
或者是
import concat from 'lodash/concat';
import orderBy from 'lodash/orderBy';
import filter from 'lodash/filter';
第二个比第一个优化得多,因为它只加载所需的模块
然后像这样使用
pendingArray: concat(
orderBy(
filter(payload, obj => obj.flag),
['flag'],
['desc'],
),
filter(payload, obj => !obj.flag),
我认为这个答案可以很容易地用在任何项目中,用较少的努力带来最好的结果。
对于Typescript用户,使用如下方式:
// lodash.utils.ts
export { default as get } from 'lodash/get';
export { default as isEmpty } from 'lodash/isEmpty';
export { default as isNil } from 'lodash/isNil';
...
和导入lodash的使用方法相同:
//some-code.ts
import { get } from './path/to/lodash.utils'
export static function getSomething(thing: any): any {
return get(thing, 'someSubField', 'someDefaultValue')
}
或者如果你更喜欢保留_以避免冲突(例如,map from rxjs vs lodash)
//some-other-code.ts
import * as _ from './path/to/lodash.utils'
export static function getSomething(thing: any): any {
return _.get(thing, 'someSubField', 'someDefaultValue')
}
更新: 似乎正确的输出方式是:
export * as get from 'lodash/get';
export * as isEmpty from 'lodash/isEmpty';
export * as isNil from 'lodash/isNil';
...
但是@types/lodash有一个奇怪的碰撞,我已经删除了这个类型包,因为我会得到这个错误:
模块”/ . ./项目/ node_modules @types / lodash / cloneDeep”使用 'export ='不能与'export *'一起使用。ts(2498)
更新:
经过一番挖掘之后,我已经转换为tsconfig。json特性esModuleInterop为true,它允许我做以下事情:
import get from 'lodash/get';
import isEmpty from 'lodash/isEmpty';
import isNil from 'lodash/isNil';
...
export { get, isEmpty, isNil, ... };
注意,这将影响项目中定义为import * as lib from 'lib'的所有导入。遵循文档,以确保它适合你。