Question

我有一个webapp和一个myconfig不同的项目，都是使用webpack4分别构建的，但都加载在同一页面上。如何使用单个运行时，以便webapp和myconfig可以共享外部供应商模块？

我希望我的html看起来像这样：

<html>
    <head>
        <meta charset="UTF-8">
        <title>Webapp</title>
    </head>
    <body>
        <script type="text/javascript" src="runtime.js"></script>
        <script type="text/javascript" src="vendor.js"></script>
        <!-- Load an external webpack transpiled myconfig.js file -->
        <script type="text/javascript" src="api/config/myconfig.js"></script>
        <script type="text/javascript" src="app.js"></script>
    </body>
</html>

在myconfig中，我想做类似的事情：

import _ from 'lodash';

export default class DefaultConfig {

    constructor() {
        console.log('Hello from new config');
        console.log(_.difference([2, 1], [2, 3]));
    }
}

在webapp中，我想做类似的事情：

import DefaultConfig from 'myconfig';
import _ from 'lodash';

const c = new DefaultConfig();
console.log(c);
console.log(_.difference([2, 1], [2, 3]));

当然，lodash只能从vendor.js加载一次。

在2个Webpack捆绑包之间共享运行时模块

0 个答案: