可以合并或嵌套ES6导入

Possible to merge or nest ES6 imports?

本文关键字:ES6 导入 嵌套 合并      更新时间:2023-09-26

许多现代JavaScript库正在从单片库更新为模块化的npm包;几个例子是lodash和d3。

这在降低构建规模方面很好,但在进口方面会有点尴尬。当加载整个库时,我写:

import d3 from 'd3';
let csv = d3.csv()...
let xScale = d3.scale()...

当加载单个模块而不是整个包时,我写:

import d3_scale from 'd3-scale';
import d3_request from 'd3-request';
let csv = d3_request.csv()...
let xScale = d3.scale.scaleLinear()...

有没有一种语法允许我合并导入,这样我就可以从单个对象(例如d3.csv()d3.scaleLinear())的每个包中调用所有函数?

当我写这个问题时,我找到了答案。自行橡胶式躲避。

排列运算符在这里看起来相当不错:

import * as d3_request from 'd3-request';
import * as d3_scale from 'd3-scale';
const d3 = {
    ...d3_request,
    ...d3_scale
};
d3.csv('path/to.csv', (error, data) => {
    let xScale = d3.scale()...
});

另一种方法是这样做

创建一个文件d3-modules.js:

export * from 'd3-request';
export * from 'd3-scale';

然后将该文件导入到您需要的位置:

import * as d3 from "./d3-modules.js";

这实际上是d3自己的做法:https://github.com/d3/d3/blob/635d44786dd4322d0c89dd98546bff91d7cce0fe/index.js