04-尚硅谷-webpack从入门到精通-start.js文件分析

哎，那么接下来呢，我们大家一起去分析一下啊，咱们的这个脚手架里面的具体配内容，首先打开scripts，我们能看到三个指令，那之前也讲了啊，Study jes呢，对应的就是我们开发环境运行的实际的文件啊，Builds呢就是生产环境对应的实际的文件，它呢我们不做研究啊，所以我们先从study JS开始来研究一下开发环境下呢，他会做些什么事啊，我们打开这个文件。往下走啊，那么首先呢，我们看到它将定的两个环境变量，一个是应用一和V，都为development，代表开发环境好，我们来看一下，所以呢，后续呢，我们通过process.uv去获取NOTUV的值呢，它都是啊，这个development对吧？定义环境变量好，那么moe应用V环境变量呢，是为wepa服务的BA应用V呢，那顾名思义是为baible服务的B内部会用，然后接下来呢，他去捕获的一些异常啊，因出现问题呢，就会报错了，然后接下来他就引入的这个computer下面的UV文件啊，UV文件呢，我们就不多去研究了，它的意思就是会加载一些环境变量，大家可以看一下，里面呢会去加载环境变量，加载环境变量除了我们定义的的话呢，它是从哪里加载呢？我们可以大致了解一下，来看一下啊，它内部呢，往下走啊，往下往下走，往下走它呢，就是定那个方法啊，最终的这个方法会调用的OK，那么将来将来如果调。

录方法啊，它加的环境变实际上就是做做到上面的是确定的这个not pass的一些值啊，将来呢，如果调用client这个environments这个方法呢，它就会去辨利我们的这个所有的这些UV啊好，这些UV之所以加载进来了，注意啊，之所以被加载进来了，是因为上面呢，通过这个DOS files这里面就是这这两个代码，它会将本地的一个点env文件啊，DOSUV这是本地的点env文件可以加载到process.env上面来。啊，所以呢，经过这一步分之后呢，我们在本地写的这些点emv文件，就是如果我在下面的个目出建个点emv文件，那么里面定的环境变量就会加载进啊，啊加载加载进来之后呢，但是这个方法呢，将来我们去研究这个方法，就会发现它只会加载。

干APP干开头的这个代码，如果你不是以APP开头的话呢，会被直接过滤掉，所以最终产生的黄金变量呢，实际上都是以re APP开头的这些环境变量会被保留下来，而其他环境变量呢，它最终是不会生效的，好所言之呢，大家也不用太操心啊，它就是加载一些本地的环境变量啊，加载这个点U文件的环境变量啊，这里面呢，未来会有个限制啊，具体怎么限制呢，我们后面看调用方法的时候就知道了，好那么接下来呢，他就引入了一大堆文件啊，这些引入呢，我们就一样的，不要去过多研究啊，一个研究的话呢，挺费劲的，我们后面看到他用的时候，我们再来回过头来看啊，它到底代表什么含义？好了，首先呢，它去调了pass pass模块呢，上节课分析了啊，它就代表路径younglo files，就是那个young样的一个缓存文件，对吧，它判断有没有这个文件啊，代表我当前有没有使用样这个工具啊，对吧？所以这里面呢，就是一个判断是。

使用样的一个工具啊，一个这样的变量是否使用样，咱们除了用NPM下载呢，我们外，PA呢也啊也可以用这个样下载，我们的也能用样下载好了，然后下面呢，就再去判断啊track require files，就是判断呢，咱们的这些文件存不存在啊，如果不存在呢，就退出进程啊，就直接退出了，就啥也不干了，他判断什么呢？判断我们的这个帕下面的indexma和这个SC下面的indexs是否存在不存在就报错啊，直接退出。是否包含必要文件对吧？分别是public下面的D，这是为什么当我们如果没有这两个文件的时候呢，我们程序会直接退出啊，因为它这里一上就做了判断啊，然后下面呢，就是去定义一些端口号了，默认多括号了，默认值呢是3000啊，如果你环境变量中定义端括号，那也行啊，默认值3000，然后定义默认的域名对吧？为定你啊，这是定义默认端号。

OK，然后呢，如果有啊，他就会给些一些相应的提示啊，然么接下来呢，他又去定要的啊，从这一个包里面一种方法叫check browses checks呢也非常顾名思义就是检查咱们的浏览器，所以呢，它调这个方法创了当前路径啊，然后检查一下浏览器，咱们呢到底使用哪个浏览器对。好，然后呢，接下来呢，成功的时候呢，他又会去检查一下咱们断个号啊，这是为什么我们在risk小售家开发的时候呢，你如果输3000 3000端号被占用了，它会自动换为3001啊，3001如果被占用呢，会换为3002，因为这里面有个方法会去检查当前呢，咱们这个应用的断号呢，有没有被占用啊，被占用了它就会自动加一再去检查啊，如果再占用又回去加一再检查，直到它没有被占用为止啊，所以这里会检查断号呗，然后检查完之后呢，注意他这里都会选择啊，去选择选择相应的顿括号，好成功了，那么顿括号呢也找到了，那么最终呢，就会去干活了，还有呢，这样的一个con factory这个方法啊con factory呢，我们后面会看到con factory这个方法呢，实际上来自于就是wepad con文件夹下面的外派con DS，也就是我们后面要研究的外PA的核心配置文件就在这了，它引入了这个con factory这个方法啊。

第二生成，生成呢，其实就是我们后面能知道就是外派的配置，它创造的development呢，说明生成的是外派的一开发环境配置，然后呢，获取到当前的一个到底使用什么协议，以及当前的一个我们的一个APP名称，以及到底是否要使用TS，对吧？然后最终呢，去生成我们想要的这个ul啊，还有DV啊，Socket啊，用来对吧，这个实通信的一些socket的一些配置，然后最终呢去创建be器啊。

那么接下来呢，我们看到这个编辑器的做巨大作用啊，那么ipad呢，就创建好编辑器之后呢，就可以通过编辑器去执行相应的工作了，把这些配置呢都传进来，传进来之后呢，下一步呢，就是去准备我们的代理配置pro配置啊，代理服务器代理，那么福代理呢，他会去pay jeson中去找这个pro配置，所以呢，我们在写代理配置的时候呢，可以在PA jeson中直接写pro去写这个代理配置啊，所以呢，它这里是加载对吧pageson中的pro配置。

OK，然后呢，接下来呢，去创建低于server啊，创建低于server配置啊，创造这些pro配置啊和东西，然后最终呢，会得到我们的所有server配置，然后再去new一个we DV server，这里是创建DVSO的配置。然后最后呢，去录一个DV外派DV server，就是我们的一个库，生成我们d server，然后DV server就是我们的开发服务器，然后再去启动服务对吧？接替摩登号和域名启动服务，然后最终呢，我们就可以看到效果了啊下面就是些打印结果了，所以整体过程呢，我们来捋一下，大概呢，其实过程呢啊挺简单的，就是呢他定义呢，它首先先检查当前呢，是否是有没有一些必要核心文件啊入口文件等呢，好，如果都有的话呢，接下来就去检查浏览器，再去检查大符号啊，看一下是否可以正常使用，对吧？那么最终都可以的话呢，就开始去啊，就开始去创建编译器了，将这些配置呢都传进去，创建我们的PA编译器comp comp啊然后呢，再去加载pro配置，再去准备这个DV serve配置啊，因为DV server呢，因为process最终是要放在DV server中一起生效的，好创建完DV server配置之后呢，去new一个外派d server，生成我们想要的DV server啊，这中间的传。

我们刚刚传递的这个compler，好，这第so呢去启动，最终就能生成我们的开发环节的开发服务器了，那么开发服务器中的配置呢，都在这个sorry con中去生成的。好了，所以呢，这大概就是我们的一个study JS的一个一个整个的一个大概过程啊，那么其实这个过程中呢，对于我们学习来讲的话呢，最关键的就是con factory里面生成的外派开发环境，这个配置到底是一个怎样的配置，这个呢是我们最最重要的一个要学习的东西，好那么这东西呢，咱们下一节课再来看啊。