1. 程式人生 > >webpack多頁面配置

webpack多頁面配置

const path = require('path'); const CleanWebpackPlugin = require('clean-webpack-plugin'); const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { entry: { 'index/index': './src/index/index.js', 'login/login': './src/login/login.js', }, output: { filename: '[name].[chunkHash:8].js', path: path.resolve(__dirname, 'dist'),   },
plugins: [ new CleanWebpackPlugin(['dist']), new HtmlWebpackPlugin({   filename: 'index/index.html', chunks: ['common/utils', 'common/vendor', 'index/index'] }),   new HtmlWebpackPlugin({   filename: 'login/login.html', chunks: ['common/utils', 'common/vendor', 'login/login'] }) ],
optimization: { splitChunks: { cacheGroups: { vendor: { // 抽離第三方外掛 test: /node_modules/, // 指定是node_modules下的第三方包 chunks: 'initial', name: 'common/vendor', // 打包後的檔名,任意命名 // 設定優先順序,防止和自定義的公共程式碼提取時被覆蓋,不進行打包 priority: 10 }, utils: { // 抽離自己寫的公共程式碼,utils這個名字可以隨意起 chunks: 'initial', name: 'common/utils', // 任意命名 minSize: 0 // 只要超出0位元組就生成一個新包 } } } },
  };