00:00
接着我们上节课来说,上节课呢,我们用livelo的这个插件,哎,最终实现了一个,他帮我们去揭示语言文件,哎,进而帮我们自动调用相应的构建任务。那到这儿我说我叫他半自动,哎,项目构建为什么这样说呢?你们到现在如果说让你们去用这个工具,你们到现在满足了吗。满足了,如果说大家都这样的话,其实这个互联网估计是一直在倒退了啊。为什么问你们满足了没有?有没有发现一个问题,我现在虽然说他可以帮我去调用调用这个相应的任务,但是我还得手动去刷新这个家。能不能申请一下什么意思呢?当我去修改一个原文件的时候,它帮我自动编译,编译完我就不用去刷新它,让它自动帮我刷新。这样的话是不是比现在咱们做这个要高级一点,哎,如何去实现这个呢?来在这儿我们往下来看,这个时候我们又要用到一个插件叫GAP connect。
01:06
呃,首先用这个插件,你先不要去多想,我在这应该是先去。下载一下它,这没问题吧,走你。好,下载完了,下载完了确认一下啊,Connect是不是有了,我为什么我有这个习惯,是因为有的同学他下载完从来不看控制台,其实很有可能下载失败了,噼里啪啦一顿敲,敲完了一堆报错也不看,那老师我这和你明明数据一样,为什么我整不了,是因为有时候你下载包很很有可能中途就啊,因为你下载的包是不是也是去发请求,从仓库里面往出调啊。很有可能,哎传输错误啊好,下载好了以后,接下来我们要去做一个配置,这个配置之前你是不是应该先得把当前插件给我引入。
02:09
二一个它叫等于一个require。来,我们先把这个。插件是不是引入了,引入了以后,哎,我们去注册一个任务,我刚刚这说的是。呃,这叫监视任务,这一把我们再来一个。注册啊,还是劫持任务吧,那这一把我这叫。全自动啊。这个叫。半自动,那说到这个呢,洗衣机你们应该知道。啊,洗衣机最早那种半字都是什么意思啊,这边一个洗的那个,这边是一个甩的,通常来说洗完打开盖把衣服拿过来放到这儿,再让他去甩,那现在是不是都是全自动了,现在洗衣机做的好一点,就是你从扔进去到消毒,紫外线杀菌,你比如。
03:06
男士不是要人家那种白领,有的要求是穿白衬衣那种,他自动给你用好了,你直接拿出来看一看可以,我早就有了,我在我当时是大一的时候,我没事干,去做兼职就是卖洗衣机。当时那个是卖什么海尔洗衣机。那那洗衣机倒是挺贵的,反正便宜的都是15000。嗯,就是从扔进去到拿出来,什么都不用罚。这也是你们奋斗的目标啊,不要十年以后了,上班加回家洗衣服还是这边洗出来拿到这边去甩,那就有点落后了,熟悉以后你们肯定不会熟悉的,来,不要想洗衣机的事情了,我们要想这个任务,我呢先给他注册一个任务task在这,哎,高级一点,提个server。
04:02
一看到这个,你们能想到这东西。在这有一个要求是一样的,还是要求他先启动对应的默认任务。注意了,我现在注册全自动的时候,已经跟半自动没有半毛钱关系了,那这个时候第三个参数还是对应的回调,在这第一步我们应该是先去配置啊服务器的选项,在这我提到一个服务器的概念。来给大家说一下,我们刚刚是不是下载下一个叫GA-connect的插件啊,这个插件它内置有个微型的服务器。特别小,这个服务器是干嘛的呢?它会读取你当前这个配置文件里面的所有设置。读完以后我知道啥,我知道你要执行哪些任务,找哪些原文件。把你的这些配置读到我的服务器里面,然后所有的工作在人家服务器里面操作,最终他给你提供一个地址,你可以去访问这个地址。
05:08
接下来我们来看一下怎么去配置它首先有个对象,它有个对象就叫server啊,有个方法,这个方法需要有一个配置对象,有这几个参数,你们这记不住没关系,嗯,只需要到时候会用也行。第一个叫root root通常是不表示根的意思啊,在这要配置的是你当前项目,也是在你的任务里边指定输出的那个文件,就是构建完输出的根目录在哪。大家说我输出的根目录在哪?咱们是不是指定Dis,为什么要说这个是是因为我现在这个index是不是在Dis下面啊。他最终给你提供一个访问地址,你访问的页面肯定还是index。
06:00
而他要找的所有资源是不是都在diss的下面啊,所以我们在这应该给他设一个,就告诉他你找资源去Dis所到下面去找就OK。接下来哎,还有一个叫live reload,这个不用说,肯定没出。表示的是。实时刷新。还有一个插件啊,还有一个配置,你们应该也能懂叫。干嘛?哎,配置它提供地址的端口号,比如说来个5000。哎,当你把这个服务器的这些选项配置完以后,接下来还要做一个操作,是跟上边这个半自动一样了。这些东西我们都得用,我就不敲了,一样了,你得告诉人家我要监视哪些原文件,并且原文件发生变化,我要启动哪些任务。
07:01
能懂不,那这个时候它也有一个特点,就是说在每一个任务的最下边。负一管道作用和上面那个一样,现在我们是不是叫个connect,注意看这个提示。作为对象里面有个方法叫reload,它俩的作用一模一样。也是,当你构建完任务,我得去刷新一次,你说不是将你构建完的效果填充到你的页面。那这样的话,每一个下面都得去铺一个。走,你这个也也来一个吧,好吧,有了做完这些操作以后,接下来我们就可以去执行干部刚起的名字是不是叫server,哎,就是当起的这个全自动的任务,好,那这个时候看一个比说。注意看,我光标停在这,但是人家告诉你一个事情,给你提供了一个server started,告诉我们一个地址。
08:03
你会发现这个端口号是不是正好是我刚刚设置的5000啊,那这个时候那你应该是去访问一下,他给我们提供的这个叫local host。5000。这是不是就是我们刚才那页面。而这个页面有了,我们将接下来来测一个东西,改背景颜色最直观了。嗯,来,Yellow ctrl s,注意下面是不是动了。看这边。动了吗?不明显是吗?来,把这个yellow换成red。CTRLS下面动了。我根本没有去刷新它。这样的话是不是要比我们刚才的要方便多啊,哎,到这儿满足了吗,大家。又满足了,哪里不满足这些东西就是一点一点去想啊。
09:00
接下来要给你们讲一个扩展,有没有发现这个地址,我还能手动去输入它。能不能让它自动帮我打开这个地址,这是不是就更方便了,那这个时候,哎,往下来看,你需要依赖一个插件叫open插件,注意它是独立于干的。用到open这个插件,你应该是先去NPM。然后install open,杠杠杠走你。这没有什么干开头了吧,就是单独一个open下载完来确认一下open是不是进来了,Open这个插件怎么用呢?你还是得先去。玩一个open等于require一个open,这是我们以前在学习,就是下载包的时候,是不是基本的东西啊,引入了以后给大家说一下来来到当前我们server的这个项目,这。
10:00
Open这个插件啊,可以自动打开。指定的链接。怎么用它open方法直接调用里面告诉他你接下来要给我打开水。放进来。我是不是就做了这一步操作啊,那接下来我们再来去执行一下NP,呃,就server走,你注意我啥也不动了。有没有发现他又帮我打开了一个。那这样的话就正儿八经的全自动。啊,从你这启动你的命令开始,如果说他执行了这个浏览器页面就打开了,以后你就再也不用管。你就去开发你的什么时候想按效果过来看就行了,因为它都是自动编译。那懂吧。
11:02
每次保存。嗯,不是,Open是什么意思,第一次你是不是启动server任务,启动server任务不是要执行下面的代码吗?Open不是帮你去打开一个链接嘛,来我们测一把,那接下来比如我改这个来一个什么呀,Blue吧,你改完CTRLS是什么意思啊,它在原有的基础上帮你去编译刷新就完了。那这个时候你到这边,这不是直接看效果吗。能懂不?怎么可能在新打开,那样的话他也太差了,哎,太差劲了,到现在为止大家应该是满足了吧,满足了吧。没有行,再给你申请一下把这个。
我来说两句