参考官网菜鸟等、对webpack知识的记录、以及webpack5新特性理解

webpack打包完后只有一个入口函数 如像图片打包完后 会成base64的一种格式 就是描述图片的很长的数据，安装webpack需要依赖node.js
优点：是减少http请求 ，减少js文件之间的依赖，可以处理浏览器不认识的 如less scss es6 （webpack只能认识一部分es6）

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin'); // 通过 npm 安装
const webpack = require('webpack'); // 用于访问内置插件

module.exports = {
     
  mode: 'production',//通过选择 development, production 或 none 之中的一个，来设置 mode 参数，你可以启用 webpack 内置在相应环境下的优化。其默认值为 production。
  entry: './src/index.js',
  output: {
     
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js'
  },
  module: {
     //“嘿，webpack 编译器，当你碰到「在 require()/import 语句中被解析为 '.txt' 的路径」时，在你对它打包之前，先 use(使用) raw-loader 转换一下。”
    rules: [
      {
      test: /\.txt$/, use: 'raw-loader' }
    ]
  },
  plugins: [//在上面的示例中，html-webpack-plugin 为应用程序生成一个 HTML 文件，并自动注入所有生成的 bundle。
    new HtmlWebpackPlugin({
     template: './src/index.html'})
  ]
};

通过loader可以使得webpack可以识别多种语言以及预处理器语法编写的模块，描述了如何处理非原生模块，以及将相关依赖引入到你的bundle中
随时补充所学~
Let yourself gradually excellent