Question

我有一个父类import _ from lodash，然后是另一个在父类中导入的类import _ from lodash。所以捆绑的js将会有两次lodash代码。

//Parent Class
import Component from 'react';
import _ from 'lodash';
import Child from './Child';
class Parent extends Component{
   // using lodash here
} 

// Child class
import Component from 'react';
import _ from 'lodash';
class Child extends Component{
   // using lodash here
}

我正在使用webpack捆绑代码..捆绑文件会有lodash代码两次吗？如何理解进口？如果是这样的话......如何防止这种情况发生？我认为模块只导入一次，即使它被导入两次..只有它的单个实例才会存在？这是真的吗？

Answer 1

Webpack 3或更高版本在进程捆绑时立即运行重复数据删除算法。如果您使用webpack＆lt; 2您可以在new webpack.optimize.DedupePlugin()配置中使用plugins。

我建议你通过这个例子导入lodash函数，因为你只能加载必要的函数并减少bundle的内存使用：

import { isEmpty, findIndex } from 'lodash';
import isEmpty from 'lodash/isEmpty';
import findIndex from 'lodash/findIndex';

父类和子类中的导入模块

1 个答案: