webpack（四）：webpack配置

4.1入口和出口

  如果每次使用webpack的命令都需要写上入口和出口作为参数，就非常麻烦，有没有一种方法可以将这两个参数写到配置中，在运行时，直接读取呢？
  当然可以，就是创建一个webpack.config.js文件（文件名字固定，不能随便取）

webpack.config.js文件内容：

path需要动态获取路径，这里要用到node的语法，首先要导出path的模块，会去node的包里面找这个path的包

当前项目还没有依赖这些包，所以要装这些包。要用到node的东西，就要对它先进行初始化。
在当前项目的路径下使用该命令：npm init

接下来修改下面的属性值。

生成下图所示：

回车，在项目生成了package.json文件

如果package.json里面还依赖其他东西的话，还要执行npm install，在当前文件夹安装一些东西。这里没有依赖其他，所以这里执行没效果。

现在的话，就会去全局里面找这个path的包

path模块下的resolve函数：用于对两个路径进行拼接，
__dirname：node上下文里面自带的一个全局变量，保存的是当前webpack.config.js文件所在的路径

这样，入口和出口（动态获取路径）定义好之后，直接使用webpack命令打包，不用再跟入口和出口参数。

但是，在开发中一般不直接使用webpack，使用npm run build，怎么将webpack与npm run build映射起来呢。
在package.json文件，scripts下创建"build": “webpack”

4.2局部安装webpack

注意：这里使用npm run build命令，相当于执行了webpack，但是与直接在终端上输webpack命令不同的是：
npm run build会优先使用这个项目webpack的版本，局部webpack。如果没有找到，会使用全局webpack。
终端上直接输webpack会使用全局webpack
比如：你使用了别人的项目，别人的webpack是1.0版本，你自己安装的全局webpack版本是2.0版本，这个时候，你直接使用webpack命令打包会出现问题。所以通常一个项目，都有自己局部的webpack。
第一步，项目中需要安装局部webpack，这里局部安装webpack3.6.0
npm install [email protected] –save -dev

安装完了之后，项目多了一个文件夹，node_modules是安装node后用来存放用包管理工具下载安装的包的文件夹

在package.json文件中：

再使用npm run build，就会用到了局部webpack打包。
参考文档