Webpack编号块未按配置正确加载

时间:2015-07-17 18:42:05

标签: javascript config webpack

所以我有两个不同的webpack配置我传递的数组看起来像这样:

[
    {
        entry: entrypointsIE,
        output: outputIE,
        module: {
            loaders: [
                  // set of loaders that has one difference to load SCSS variables from a different location
            ]
        },
        resolveLoader: resolveLoader,
        resolve: resolve,
        plugins: plugins,
        devServer: devServer
    },
    {
        entry: entrypoints,
        output: output,
        module: {
            loaders: [
                 // loaders all the same as the IE9 except one difference in sass loader    
            ]
        },
        resolveLoader: resolveLoader,
        resolve: resolve,
        plugins: plugins,
        devServer: devServer
    }
]



output = {
    path: '/web/dist',
    filename: '[name].bundle.js',
    chunkFilename: '[id].bundle.js'
};

outputIE = {
    path: '/web/dist',
    filename: '[name].ie.bundle.js',
    chunkFilename: '[id].ie.bundle.js'
};

apps.forEach(function(appName, index) {
    entrypoints[appName] = [ 'webpack/hot/dev-server', appName + '/app' ];
});

appsIE = apps;

appsIE.forEach(function(appName, index) {
    entrypointsIE[appName] = [ 'webpack/hot/dev-server', appName + '/app.ie' ];
});

入口点是完全相同的文件(这是我认为我的问题来自的地方)。我的index.html中有一个条件,如果它检测到IE则加载framework.ie.js,如果没有,则加载framework.js。这按预期工作。问题是它不会一致地加载编号的块。有时我会看到0.bundle.js被加载,有时我会看到0.bundle.ie.js被加载(无论是framework.ie.js还是framework.js都已加载)。

有没有办法让它一致地加载正确的块,或者有没有办法确保我需要的所有东西都被加载到框架包中而没有任何块被webpack加载?

2 个答案:

答案 0 :(得分:5)

找到解决方案。添加:

new webpack.optimize.LimitChunkCountPlugin({maxChunks: 1}

使得我的入口点块是唯一创建的块,因此逻辑正常工作。

答案 1 :(得分:0)

您是否尝试过使用条件注释来加载基于浏览器供应商的正确脚本?

<!--[if IE]>
    <script src="framework.ie.js"/>
    <script src="0.bundle.ie.js"/>
<![endif]-->

<!--[if !IE]> -->
    <script src="framework.js"/>
    <script src="0.bundle.js"/>
<!-- <![endif]-->