（三）File-loader 打包图片

const path = require('path');

module.exports = {
  mode: 'production',  
  entry: './index.js', 

  // 添加： 打包图片
  module: {
    rules: [{
      test: /\.(png|jpg|gif)$/,
      use: { 
        loader: 'file-loader'  // 打包图片需要file-loader插件
      }
    }]
  },


  output: {
    filename: 'bundle.js', 
    path: path.resolve(__dirname, 'bundle')
  }
}

var Header = require('./js/header');
var Content = require('./js/content');
var Footer = require('./js/footer');
var avatar = require('./img/01.jpg');
// import Header from './js/header';
// import Content from './js/content';
// import Footer from './js/footer';
// import avatar from './img/01.jpg';
 console.log(avatar)

new Header();
new Content();
new Footer();

module.exports = {
  module: {
    rules: [{
      test: /\.(png|jpg|gif)$/,
      use: { 
        loader: 'file-loader',  // 打包图片需要file-loader插件
        options: {
          // placeholder 占位符
          name: '[name]_[hash].[ext]',
          // 打包后路径
          outputPath: 'images/'            
        }
      }, 
    }]
  },
}