Class 通过webpack动态创建导出类的实例

我有一个基于组件的系统，其中组件是通过webpack导出的es6类

export default ClassName {}

import ClassName from "classname.js"

这一切都是可行的，我把它自动化了

现在对于下一部分，我需要自动创建这个导入类的实例，如下所示：（伪代码）

我不能这样做，因为“ClassName”中的c没有定义。当我通过webpack查找编译的js时，我看到它将我的类作为_ClassName导入。所以我试着预编一个uuu，但仍然没有结果

---

有没有人有使用webpack自动实例化类的经验？

以上评论解决了这个问题

对于任何感兴趣的人，这是现在自动生成的文件：

/* this file is auto-generated.  DO NOT MODIFY*/
import BreakpointTool from '../../Components/BreakpointTool/scripts/BreakpointTool.js';
import ComponentA from '../../Components/componentA/scripts/componentA.js';
import FoundationMenu from '../../Components/FoundationMenu/scripts/FoundationMenu.js';
import Slider from '../../Components/Slider/scripts/Slider.js';

var componentIncludes = [
        BreakpointTool,
        ComponentA,
        FoundationMenu,
        Slider
    ];

var componentsList = [
        "BreakpointTool",
        "ComponentA",
        "FoundationMenu",
        "Slider"
    ];

var components;

function getComponentObjectByName(name) {
    var index = componentsList.indexOf(name);

    if (index == -1) {
        return null;
    }

    return componentIncludes[index];
}

$(function () {
    components = new Map();

    for (var c of componentsList) {
        var $component = $("." + c);

        if ($component.length > 0) {
            $component.each(function (i, elm) {
                var componentName = this;
                var componentId = componentName + "_" + i;

                var componentObject = getComponentObjectByName(componentName);
                var component = new componentObject(elm, componentId);

                components.set(componentId, component);
            }.bind(c));
        }
    }
});

---

你在使用什么插件？这是因为缩小还是丑陋？它还没有使用缩小，只是使用默认环境预设的巴贝尔transpiler。Webpack似乎有一个导入的范围，我想我需要弄清楚如何访问它“组件是一个包含所有类名的字符串数组。”这是从哪里来的？为什么它必须是字符串？如果所有组件都被替换，它难道不是数组吗？我用一个文件生成器生成数组，我也用所有导入语句生成一个文件。我将尝试使用所有导入的组件生成一个数组。谢谢你的提示！它起作用了，在生成导入语句的同一脚本中，我创建了一个引用导入对象的数组。然后使用name/obj映射，我可以按名称动态创建实例。谢谢你的见解！

/* this file is auto-generated.  DO NOT MODIFY*/
import BreakpointTool from '../../Components/BreakpointTool/scripts/BreakpointTool.js';
import ComponentA from '../../Components/componentA/scripts/componentA.js';
import FoundationMenu from '../../Components/FoundationMenu/scripts/FoundationMenu.js';
import Slider from '../../Components/Slider/scripts/Slider.js';

var componentIncludes = [
        BreakpointTool,
        ComponentA,
        FoundationMenu,
        Slider
    ];

var componentsList = [
        "BreakpointTool",
        "ComponentA",
        "FoundationMenu",
        "Slider"
    ];

var components;

function getComponentObjectByName(name) {
    var index = componentsList.indexOf(name);

    if (index == -1) {
        return null;
    }

    return componentIncludes[index];
}

$(function () {
    components = new Map();

    for (var c of componentsList) {
        var $component = $("." + c);

        if ($component.length > 0) {
            $component.each(function (i, elm) {
                var componentName = this;
                var componentId = componentName + "_" + i;

                var componentObject = getComponentObjectByName(componentName);
                var component = new componentObject(elm, componentId);

                components.set(componentId, component);
            }.bind(c));
        }
    }
});