我有不同的gits与不同的反应应用程序。每个应用程序应该使用相同的供应商块文件与外部包(React,ReactDOM ...)
Project 1 (git)
/dist/...
/src/...
webpack.config.js
Project 2 (git)
/dist/...
/src/...
webpack.config.js
Project N (git)
...
每个webpack.config.js
都包含此配置,但具有不同的库名称:
module.exports = {
entry: {
app: './src/App.ts',
vendor: ['react', 'react-dom', 'react-redux', 'redux', 'redux-thunk']
},
output: {
path: path.resolve(__dirname, "dist"),
filename: '<Name>.bundle.js',
library: "<Name>",
libraryTarget: "umd"
},
module: { /* ... */ },
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
filename: 'vendor.bundle.js'
})
]
}
Webpack为当前的库/项目构建了一个vendor.bundle.js
,而不是为了全局使用,是否有一个webpack创建vendor.bundle.js
的选项,它可以包含在一个页面上,其中两个应用程序都可以基于此文件加载:
<html>
<head>
<script src="/vendor.bundle.js"></script>
</head>
<body>
<script src="/app1.bundle.js"></script>
<script src="/app2.bundle.js"></script>
</body>
</html>