在Webpack中調用多個入口點

我正在使用webpack with typingcript和babel來管理我的客戶端Web應用程序。在Webpack中調用多個入口點

我希望爲第三方腳本提供vendor.js文件，main.js文件和我可以根據需要加載的每頁腳本爲頁面提供特定的功能。

所有的腳本正在編譯，因爲我期望，但只有vendor.js文件實際上被調用。其他編譯，但從未調用。

以下是我的webpack.config.js文件。

'use strict'; 

let webpack = require('webpack'); 

module.exports = { 
    entry: { 
    main: './assets/js/main.ts', 
    "single-page": './assets/js/src/new-loan.ts', 
    vendor: [ 
     "svg4everybody" 
    ] 
    }, 
    output: { 
    filename: './public/assets/js/[name].js' 
    }, 
    resolve: { 
    extensions: ['', '.webpack.js', '.web.js', '.ts', '.js'] 
    }, 
    plugins: [ 
    new webpack.optimize.CommonsChunkPlugin({ 
     name: "vendor", 
     minChunks: Infinity 
    }) 
    ], 
    module: { 
    loaders: [{ 
     test: /\.ts(x?)$/, 
     loader: 'babel-loader!ts-loader', 
     exclude: /node_modules/ 
    }] 
    } 
}

這是一個頁面特定文件的例子。理想情況下，加載時，該文件將在頁面上觸發alert通知。

webpackJsonp([1],[ 
/* 0 */ 
/***/ function(module, exports) { 

    'use strict'; 

    alert('test'); 

/***/ } 
]);

我可以看到/爲什麼/警報未觸發（永遠不會調用的模塊功能），但我無法弄清楚如何配置的WebPack工作，我怎麼想它。

感謝您的協助。

來源

2016-04-12 jdp

如何創建一個導入所有其他項的單個條目？ –

我不想在每個頁面中加載所有內容。 – jdp

我發現CommonsChunkPlugin覆蓋了配置中的vendor包。嘗試將CommonsChunkPlugin的名稱更改爲common，並從vendor更改爲common，然後在所有文件中包含common包。如果使用CommonsChunkPlugin，則只有通用包將包含核心webpack模塊加載器輔助函數，因此它必須嵌入到每個頁面中。

new webpack.optimize.CommonsChunkPlugin({ 
    name: "common", 
    minChunks: Infinity 
})

來源

2016-04-12 19:40:05

在Webpack中調用多個入口點

回答

相關問題