Webpack - 即使它不在'供应商'中也能反应工作

我正在使用Webpack + React，并使用CommonsChunkPlugin。事情是，即使我没有把它放在“供应商”条目中，反应也能正常工作（对于其他软件包而言）。那有意义吗？Webpack - 即使它不在'供应商'中也能反应工作

我的配置是这样的：

config.entry.vendors = ['mobx', 'jquery', 'highcharts', 'react-highcharts', 'moment', 'numeral', 'jquery-ui', 'jquery.cookie', 'lodash', 'jquery.waitforimages', 'raven-js']; 

config.module.loaders = config.module.loaders.concat([ 
    { 
    test : /\.less$/, 
    loader: ExtractTextPlugin.extract({ 
     fallback: "style-loader", 
     loader : "css-loader?sourceMap!postcss-loader!less-loader?sourceMap" 
    }) 
    } 
]); 

config.plugins = config.plugins.concat([ 
    new ExtractTextPlugin('[name]-[chunkhash].min.css'), 
    new webpack.optimize.UglifyJsPlugin({ 
    minimize : true, 
    mangle : false, // { except: ['$super', '$', 'exports', 'require'] }, 
    compressor: { 
     warnings : false, 
     screw_ie8: true 
    }, 
    sourceMap : true 
    }), 
    new StatsPlugin('webpack.stats.json', { 
    source : false, 
    modules: false 
    }), 
    new webpack.optimize.CommonsChunkPlugin({name: 'vendors', filename: 'vendors-[chunkhash].min.js'}), 
    new WebpackMd5Hash(), 
    new ManifestPlugin(), 
    new InlineManifestWebpackPlugin({ 
    name: 'webpackManifest' 
    }) 
]);

的WebPack的输出值是：

output: { 
    filename   : '[name].bundle.js', 
    publicPath  : '/', 
    path    : paths.dist, 
    sourceMapFilename: "[name].js.map", 
    },

来源

2017-02-11 refaelos

它主要取决于你如何使用CommonsChunkPlugin，你可以在这里发布webpack配置吗？ – havenchyk

@havenchyk添加了配置 – refaelos

可能的重复[如何分开捆绑供应商脚本并按需要使用Webpack？]（http://stackoverflow.com/questions/30329337/how-to-bundle-vendor-scripts-separately -and-require-them-as-needed -with-webpack） –

CommonsChunkPlugin是足够聪明，你没有为CommonsChunkPlugin指定chunks财产，这意味着插件将尝试通过所有条目并将通用部分移动到供应商大块，然后转换成供应商 - [chunkhash] .min.js文件。

例如你有2个入口点：index.js，signin.js并在这两个你有下面的代码：

const React = require('react') 
const ReactDOM = require('react-dom')

与配置

所以像

entry: { 
    app: './index.js', 
    signin: './signin.js', 
    vendor: ['react'] 
}, 
***** 
plugins: [ 
    new webpack.optimize.CommonsChunkPlugin({ 
     name: 'vendor', 
     filename: 'vendor-[chunkhash].js' 
    }) 
]

你仍然有厂商块react-dom。

另一方面，如果您有第三个入口点而不需要react-dom，则只有react将被移至供应商块。

但即使在这种情况下，您仍然有react-dom包含在前两个条目块中。

的事情是，反应工程活动时，我不把它放在“厂商的进入（同其他软件包）。

所以反应会在任何情况下工作，唯一的区别是，将react块移动到vendors与否，如果没有，它仍然会包含在你的切入点文件。

希望它有帮助。

来源

2017-02-12 11:39:43 havenchyk

谢谢！所以反应包含在入口点文件中。如果我将它添加到“供应商”，它将包含在供应商文件中并从入口点文件中删除？ – refaelos

@refaelos是的，它应该以这种方式工作。 – havenchyk

Webpack - 即使它不在'供应商'中也能反应工作

回答

相关问题