* 入口(entry) ： 指示 webpack 应该使用哪个文件为入口起点开始打包，分析构建内部依赖图 * 输出(output) ： 指示 webpack打包后的资源bundles输出到哪里去，以及如何命名 * loader：（webpack默认来了个打包js和json）指示 webpack处理那些非js文件（如css等） * 插件(plugins) * 模式(Mode)： 可以用于执行范围更广的任务。插件的范围包括，从打包优化和压缩，一直到重新定义环境中的变量。[插件接口](https://www.webpackjs.com/api/plugins)功能极其强大，可以用来处理各种各样的任务 ~~~ const HtmlWebpackPlugin = require('html-webpack-plugin'); // 通过 npm 安装 const webpack = require('webpack'); // 用于访问内置插件 const path = require('path'); const config = { entry: './path/to/my/entry/file.js', output: { path: path.resolve(__dirname, 'dist'), filename: 'my-first-webpack.bundle.js' }, module: { rules: [ { test: /\.txt$/, use: 'raw-loader' } ] }, plugins: [ new HtmlWebpackPlugin({template: './src/index.html'}) ] }; module.exports = config; ~~~