webpack多页面配置

最新推荐文章于 2025-09-12 17:28:06 发布

转载最新推荐文章于 2025-09-12 17:28:06 发布 · 73 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/siso/p/9983796.html

文章标签：

#webpack #ViewUI

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: {
    path: path.resolve(__dirname, 'dist'),
    filename: '[name].[chunkHash:8].js',
    chunkFilename: "[name].bundle.js" 
  },

    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字节就生成一个新包
                }
            }
        }
    },

    
};

转载于:https://www.cnblogs.com/siso/p/9983796.html