配置文件
有点小伙伴说，不对啊，我都没有配置，webpack怎么知道我要打包哪些文件，又把打包后的文件输出到哪里呢？
原来，webpack会默认在项目根目录寻找名为webpack.config.js的配置文件，如果没有找到该文件或该文件没有任何导出，webpack则会默认把src/index.js作为打包入口，而将打包后的文件输出到dist/main.js。
しかし，我这篇文章已经命名为风骚配置篇了，因此默认的配置是绝对不能接受的。
如果从第一篇过来的朋友，那么你们的项目根目录下已经有了webpack.config.js配置文件了，我们来小试牛刀吧。
小试牛刀
还记得我们在第一篇中说到入口，出口分别是webpack的核心概念之一吗？
入口起点(entry point)指示 webpack 应该使用哪个模块，来作为构建其内部依赖图的开始。进入入口起点后，webpack 会找出有哪些模块和库是入口起点（直接和间接）依赖的。
这是webpack官网上关于入口的概念，简单来说，就是你通过一个罪犯，把他牵连的整个犯罪团伙连根拔起。那么这个罪犯就是我们破案的入口。同样，webpack会根据打包入口文件，找到他依赖的所有的资源，然后递归处理打包。
那么出口则是：
output 属性告诉 webpack 在哪里输出它所创建的 bundles，以及如何命名这些文件，默认值为 ./dist。基本上，整个应用程序结构，都会被编译到你指定的输出路径的文件夹中。
基本说清楚了。
我们开始风骚之旅，首先修改入口和出口。打开webpack.config.js，输入以下代码：
const path = require('path')
module.exports = {
entry: './src/b.js',
output: {
filename: 'bundle.js',
path: path.join(__dirname, 'output')
}
}
然后在src目录下新建一个b.js文件。
// b.js
console.log('b.js')
OK，回到根目录，我们继续执行
npx webpack
运行成功后，我们看到这次打包过后，根目录下多了一个output的文件夹，里面的文件不再是main.js，而是bundle.js了，就说明，我们的改动已经生效了。
值得注意的是，webpack打包的时候，是运行在node环境里的，因此可以使用node的模块方法（比如path.join）以及他的伪全局变量（比如__dirname）；另一个需要注意的是，entry的字面量需要加"./"，不能够单是"src/b.js"，否则可能会出错。
出入口试验成功，我们接下来说说，webpack对于es6语法编写的代码、sass编写的样式等，是怎么进行构建的。
loader
loader，也是webpack中核心概念之一。由于webpack主要是用于js的模块化打包，非js的文件资源其实webpack本身是处理不了的。所以loader主要的功能就是将这些webpack处理不了的资源文件，转换成可以处理的js资源。
举个栗子，css文件是webpack本身不能够处理的资源，那么我们就可以通过css-loader和style-loader把他处理成js模块，然后导入主函数进行加载。具体的原理，我们会在后面的文章阐明，这里我们先来示范一下，配置文件中，怎么设置loader，使得他们可以正常工作起来。（待续）
