Webpack 2：构建多部件库并作为外部使用

Question

我正在使用Webpack 2并尝试捆绑将在我公司的几个项目中使用的公共库。依赖关系包括vue，vue-router和其他一些。将这些供应商依赖关系打包到一个公共文件中似乎是有意义的，然后将其作为外部包含在各种项目中。但是我似乎无法让它发挥作用。

我的库webpack.config.js包含以下行：

entry: {
    common: [
        'vue',
        'vue-router'
    ]
}
...
output: {
    filename: '[name].js',
    libraryTarget: 'var'
}

我的消费项目的webpack.config.js包括：

externals: {
    'vue': 'Vue',
    'vue-router': 'VueRouter'
}

我已经尝试将output.library设置为common，将外部设置为['common','Vue']。这不起作用。

我已经尝试将libraryTarget同时设置为"amd"的库和消费者，这只会导致define未定义。如果我使用"var"，那么只有在common中只包装一个库时才会有效，如果我包含多个库，则两者都是未定义的。

我正在尝试做什么？感谢。

Answer 1

据我了解，你需要使用外部（如上所述）以及所有内容。

然后你可以用＆＃34; es5方式获得你的外部依赖＆＃34;作为脚本标记（例如https://unpkg.com/vue@2.2.6/dist/vue.runtime.min.js）或来自npm并使用它。或者，如果需要，可将其保存到* .js文件中。

Webpack创建包可能会从模块（例如es 2015）或全局变量（es5）获得依赖。

所以外部库的捆绑已经存在于npm。