摘要：上以章节了解到了webpack是干什么的以及webpack有那些核心内容，从此章节开始学习webpack中的核心内容如何使用以及所起的作用。从配置文件中学习对应的核心点。
一、Using a Configuration（使用配置文件来学习）
As of version 4, webpack doesn't require any configuration, but most projects will need a more complex setup, which is why webpack supports a configuration file. This is much more efficient than having to manually type in a lot of commands in the terminal, so let's create one to replace the CLI line options used above:大概意思为：从版本4开始，webpack不需要任何配置，但大多数项目都需要更复杂的设置，这就是webpack支持配置文件的原因。 这比在终端中手动输入许多命令更有效率，因此我们创建一个替换上面使用的CLI行选项。
step1:
在项目根目录下创建一个webpack.config.js,内容如下：
const path = require('path'); module.exports = { entry: './src/index.js', // 入口文件，这里和默认的一样， output: { filename: 'main.js', // 输出文件名 path: path.resolve(__dirname, 'dist') // 输出文件的路径 } };
step2 运行如下命令
npm webpack --config webpack.config.js这里--cinfig 可以指定配置文件名，因此配置文件名不一定是webpack.config.js， 其他名称也可以，只要在--cofig的时候写正确即可，比如配置文件名改为webpack.base.config.js 在运行的时候用 npm webpack --config webpack.base.config.js 也是可以的。但是webpack.config.js存在，但是在运行的时候没有用--config来指定，则默认为webpack.config.js这个文件，当然默认的文件名最好不要改。编译成功后打开浏览器就可以看到会打印出一个Hello webpack。
由于从CLI运行webpack的本地副本并不是特别有趣，我们可以设置一个小捷径。 让我们通过添加一个npm脚本来调整我们的package.json：
修改package.json:里面增加这么一句 "build": "webpack"
{ "name": "webpack-demo", "version": "1.0.0", "description": "", "main": "index.js", // 这一行删除 "private": true, // 新添加这一行 "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "build": "webpack" // 这是增加的 }, "keywords": [], "author": "", "license": "ISC", "devDependencies": { "webpack": "^4.8.3", "webpack-cli": "^2.1.3" } }
修改成功后运行npm run build，也有同样的效果。这种方式推荐。
二、结论
到这里已经一步步配置了最基本的配置文件，也是webpack配置构建的第一步，从下章节开始学习资产管理，就是说对项目中的资产进行管理，像图片，字体，样式等等，通过webpack来管理。
