将动态内容添加到Webpack条目

时间:2017-04-25 09:49:47

标签: webpack webpack-2

我试图为每个条目编写插件(或找到一个),我可以添加额外的代码。

如果我有2个输入文件:

// entry1.js
import React from "react";

export default function() {
    return (
        <div>
            Entry 1
        </div>
    );
}

// entry2.js
import React from "react";

export default function() {
    return (
        <div>
            Entry 2
        </div>
    );
}

和webpack配置文件:

module.exports = {
    entry: {
        entry1: "./entry1.js",
        entry2: "./entry2.js",
    },
    output: {
        path: path.join(__dirname, "../output"),
        filename: "js/[name].js",
        publicPath: "/",
    },
}

然后,每个webpack条目都应添加以下内容:

import React from "react";
import ReactDOM from "react-dom";

import Component from "????";

ReactDOM.render(<Component />, document.getElementById("mount"));

其中???? {1}为{1}},./entry1.js为entry2等等。

我已经在emit阶段尝试了子编译,但引用现有模块是一个问题,我认为应该尽快完成它。

使用上面这样的代码,我觉得我真的需要在加载器操作它们之前用一个引用旧条目模块的新模块替换入口模块。

不确定从哪里开始,所以任何指导都会受到赞赏

0 个答案:

没有答案