웹 패키지 연습 템플릿

//        
let path = require('path')

//  html-webpack-plugin  ： cnpm install html-webpack-plugin --save-dev
let HtmlWebpackPlugin = require('html-webpack-plugin')

//console.log(path.resolve(__dirname,'dist'))

module.exports = {
    //     
    entry:'./src/index.js',
    output:{
        //         
        filename:'bundle.js',
        //     
        //     
        path:path.resolve(__dirname,'dist')
    },
    //     production（    ）
    mode:'development',
    // loader   
    module:{
        //              
        rules:[
            {
                test:/\.css$/,
                use:[
                    // use   loader        ，    
                    // js        style  
                    'style-loader',
                    'css-loader'
                ]
            },
            //    
            //      
            {
                test:/\.(jpg|png|gif)$/,
                loader:'url-loader',
                //    8kb,base64  ,       ，        
                options:{
                    limit:8*1024,
                    // url-loader es6       ，   html-webpack-plugin  
                    esModule:false,
                    // hash   ，    ext
                    name:'[hash:10].[ext]',
                }
            },
            {
                test:/\.html$/,
                loader:'html-loader'
            }
        ]
    },
    //    
    plugins:[
        new HtmlWebpackPlugin({
        	//    
            template:'./src/index.html'
        })
    ],
    //   
    devServer:{
        //      
        contentBase:path.resolve(__dirname,"dist"),
        //   gzip   
        compress:true,
        //   
        port:9566,
        //       
        open:true
    }

}