source: 'src',
img: 'src',
image: 'xlink:href'
}
}
其中，主要就是根据NODE_ENV这个变量，然后分析是否是生产环境，然后将根据不同的环境来加载，不同的环境，来判断是否开启了sourceMap的功能。方便之后在cssLoaders中加上sourceMap功能。然后判断是否设置了cacheBusting属性，它指的是缓存破坏，特别是进行sourceMap debug时，设置成false是非常有帮助的。最后就是一个转化请求的内容，video、source、img、image等的属性进行配置。
具体的还是需要去了解vue-loader这个webpack的loader加载器。
分析了这么多，最终回到webpack.base.conf.js文件中
webpack.base.conf.js
其实的两个方法，其中一个是来合并path路径的，另一个是加载Eslint的rules的。
我们直接看后面那个函数，createLintingRule方法：
其中，加载了一个formatter，这个可以在终端中显示eslint的规则错误，方便开发者直接找到相应的位置，然后修改代码。
之后的一个对象，就是webpack的基础配置信息。我们可以逐一字段进行分析：
context => 运行环境的上下文，就是实际的目录
entry => 入口文件：src下的main.js文件
output => 输出内容，这内部的配置会根据不同的运行环境来进行变化
resolve => 其中的extensions字段，指定检测的文件后缀，同时alias是用于指定别名的。在引用文件路径中，如果有别名的符号，会被替换成指定的路径。
module => 配置了一些eslint、vue、js、图片资源、字体图标、文件等加载的loader。详细的可以去看webpack的官方网站。
node => 此处部分有注释，主要是阻止一些webpack的默认注入行为，因为在vue中，已经具备了这些功能。
看完这些，你或许对webapck.base.conf.js中的内容有了一些初步的了解。其实，看懂它还需要你了解webpack这个非常有用的打包工具。
之后，我们在来回看webpack.dev.conf.js这个文件
webpack.dev.conf.js
这个文件中，引用了webapck-merge这npm包，它可以将两个配置对象，进行合并。代码如下：
const merge = require('webpack-merge');
const devWebpackConfig = merge(baseWebpackConfig, {
...
}这样就合并了base中的webpack配置项。之后，我们可以来看一下dev环境中的新增了那些配置项，它们分别起到了什么作用？
首先，在module的rules中增加了cssSourceMap的功能
然后就是devtools，通过注释的英文翻译，可以知道cheap-module-eval-source-map使得开发更快。
之后，就是devSever的一些配置项了。其中包块客户端报错级别、端口、host等等
还有新增的plugins，我们可以来看一下实际新增的plugins(具体可以看webpack文档)：
