我一直在研究将微服务概念应用到前端。我希望实现的一个重要好处是使用我的React应用程序可独立部署的UI组件/页面。我正在考虑采用像article这样的复合前端方法。
我们的应用程序可能有多个webpack配置,每个主要页面/组件一个。我希望能够在每个页面中使用单个React lib块。以下是两个可能的webpack配置示例:
// Page 1 component
var webpack = require("webpack");
module.exports = {
entry: {
Page1: 'Page1.js',
React: ['react', 'react-dom']
},
output: {
filename: '[name].js'
},
module: {
loaders: [
{
test: /\.css$/,
loader: 'style!css'
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader'
}
]
},
plugins: [
new webpack.optimize.CommonsChunkPlugin('React', 'bundle.react.js')
]
}
// Page 2 component
var webpack = require("webpack");
module.exports = {
entry: {
Page2a: 'Page2a.js',
Page2b: 'Page2b.js',
React: ['react', 'react-dom']
},
output: {
filename: '[name].js'
},
module: {
loaders: [
{
test: /\.css$/,
loader: 'style!css'
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader'
}
]
},
plugins: [
new webpack.optimize.CommonsChunkPlugin('React', 'bundle.react.js')
]
}
这可以在不同的webpack配置中引用相同的公共块吗?