03. 尚硅谷_自动化构建工具webpack_config配置文件说明.avi原创

好，咱们接着上节课来讲，上节课呢，我们对这个GS模块以及GS的模块啊，我们进行了一个打包处理，那么这节课呢，我们来看一下我们上一节的命令是怎么样执行的，大家看我在命令行输入的是这么长的命令。那结合着我们刚学完的group和G来说，后边这个是不是要去添加的一些参数啊。而我最终的目的应该是只执行一个webpack就行，其他那些东西不应该出现在命令行，如果说每次都出现在命令行的话，太啰嗦太烦了啊。这个时候呢，我们需要用到一个配置文件，这个配置文件呢叫backpack.con.gs。那么我们可以不用看教程，看在哪找，你上登录这个官网以后，这不是有个指南吗？点击指南以后，看到就这个列表安装，这是教大家如何去哎本地啊全局安装，然后呢，这有个起步，起步这儿诶大家看这有一个叫使用一个配置文件好点一下。

使用这个配置文件呢，你得往下翻，一直翻到哪，其实你看它这个，这不是创建一个B文件吗？哎，他这个呢，就是没有说你比如像我们锚点定位那样，就直接到固定的位置，这样的话还导致我得干嘛往下翻，这不是使用一个配置文件吗。那么在这里边找一个文件，叫什么one pack.con.js而这个里边所写的东西呢，就是我们要去配置的，我直接把它拿走，拿走了以后注意先在你当前的项目下，你去创建一个we p点，哎con.gs然后给它放进来。这里面都有什么东西，我来给大家说一下。第一个pass，其实你们在node里面已经见过了。

见过他没有？Pass。它呢是note，哎，内置的模块用来去设置什么路径的，Pass本身就是表示路径的，你看我根本是不是没有下载pass这个模块，但是我可以直接去引入它，没有任何问题，这是它内置的，好，再往下这是外pad真正的一个配置。Modu.xbo的一个对象，这种方式它是么？用的是common JS规范。好，里面这一看就能懂，这是我们刚才接触的，也是他官网上说的。在webpack里面四个重要概念里面的第一个。Int是不是表示入口的意思，在这放置的是什么呢？就是你当前项目的主文件，又叫入口文件，找一下我们的在哪。

我们不应该是用它这个对不对，咱们是src下边GS下边，然后呢in.GS。那output，我这写一下吧，这表示的是啊。入口文件的。配置，那么这个呢，这output直接简单的我就直接就写了，这个呢是出口，其实又叫什么输出的，哎配置。On是一个对象，里边有两个属性，一个叫fair name，这这什么？哎，对，这呢是输出的文件名，那后边这pass就是设置它的路径，这个文件名我就先不动了，就放它，而在pass这大家看。当你引入这个pass这个模块的时候，它里边有个方法叫做。

哎，方法叫做造物，这个方法调用就是用来去设置路径。这家伙你们见过吧？什么时候见过呢？在哪见过？NOEJS里面吧，Global全局对象是不是有五个属性啊，其中有一个不就是它吗？它表示的是什么？根目录，然后那你绕了，我们说一下，它现在的做法是前边是你比如说是根目录，后边的路径是相当于和前边的拼接而成的，那我们现在要指定一个输出路径的话，是从根目录出发，然后我是不是让它应该是到第所下边的。GS下面就OK了，这不就是我们之前设计的吗？哎，大家看我先把我之前打包的那个删掉，注意我这个index没删啊，Index没删diss的删不删这个文件夹删不删都行，但是我是不想把index删了，能懂不？那配置完这些东西，你接下来就可以不用执行这么长的命令。

你只需要执行一个mappa回车，然后我再点击一下，这是不是照样的就是它。这是为什么？诶，为什么我现在就不用写那些，后面设置那些找文件呀，指定输出目录呀。你得知道它的工作原理。也就是one pack在执行命令的时候，他上来先去当前项目下找一个配置文件，就叫pack，点点GS。找到它以后，我是不看这个，哎，我里面的设置啊，那么通过读取这些设置，我就知道我找哪个入口文件，然后我要指定我的输出文件以及输出的路径。啊，那这就是他这个配置，而我们的实际开发当中肯定会有，它不会说不写它，因为里面要写很多的配置。

这个能懂吧，来，我把这个视频体验隔开的。