00:01
到此呢,我们已经把咱们的前端的能常见的资源呢,全都处理了。那么现在开发环境还要做什么事呢?那么接下来我们要做的就是自动化。原因就是我们每次写完代码呢,都得重新编译才能看到效果,非常的麻烦。下面我们来演示一下。我现在呢,想把JS代码呢进行一些修改。来,我们现在不是一加一加二加三加四,我再加个五。对吧,我已保存,那么如果我们直接运行这个打包后的这个资源,你会发现。它还是一加二加三加四,还是十,不是15没有变。原因就是我们改动的是源代码,没有重新打包,所以这个打包的代码呢,是之前的代码。之前代码是十,所以他输出自然是十。那这样的话呢,我们要想看到新的啊,这个情况我们得再次重新打包。
01:05
好,然后呢,这样呢,才会看到这个最新的效果。不单JS这样,CS的结构HL都是这样的,每次改代码你要打包一下才能看效果,非常的麻烦。我们希望一切自动化,那么有没有办法呢?有的就是我们接下来要学的这个自动化dev server。DB server呢,它会在WiFid这里创建一个,搭建一个服务器,开发服务器,它会自动的监视我们这个src目录下面的文件,一旦发生变化,它就会重新打包,自动的重新打包,那么我们自然就可以看到这个自动的这个最新的效果了。那么我们就得用这个技术啊,用技术的话呢,需要下载这个DV这个包。下载完之后呢,要进行一些配置,我们直接复制啊。来。我们要启动一个服务器啊,所以这里要做一些开发,服务器的配置要指定的有号是我们的服务器的域名,POS是服务器的端口号,欧盟为出呢,就是会自动打开这个浏览器。
02:13
这样呢,它一旦服务器启动成功了,浏览器就会打开,这样我们可以直接看效果。好,一旦你用DV server呢,启动指令就变了,之前我们是直接PE npspe就好了,好,现在是nspe serve才能运行。只有v PS WiFi so这个指令才能启动这个咱们的这个DV搜狗的配置,如果你用的是之前的指令的话,它是没办法启动这个配置的,虽然你写了配置,但是配置并不剩效。所以要注意啊,要启动的话呢,指定是npspe so。好,启动成功呢,它在这里会编译成功,同时光标会停在这里,代表这个服务器在开启着。
03:00
服务器还在运行。好,同时自动打开浏览器,显示楼空号3000。这时候我们呢,可以看一下输出的代码,它现在是一还是15,那么我们改动一下这个代码。然后把这个五去掉。一保存,它会自动的编译,你会发现它又重新编译了。那么一旦自动编译呢,那么浏览器也会自动刷新,会显示最新的效果。所以这样开发呢,就会比较方便,不管你改啥都可以啊,你改啥都可以达到你的效果,比如我们改样式。我上面这个呢,变成200PS。一保存诶,它就会重新编译,然后呢。页面就出现效果了。改H6我们去public下面,注意不要改输出的文件,改public下面的文件,我们hello派呢加个小尾巴一保存。那么诶,小尾巴就来了。所以这个地域server呢,它会自动监视我们的这些文件啊,一旦发生变化就会重新编译打包,所以非常的方便。
04:02
好,那么这个呢,就是我们的这个DB server的整个用法,首先下载一个包,然后呢进行一个配置,然后启动指令呢,变成n PS ipad serve,那么就可以达成这个自动化,这样呢我们开发起来就更更加方便了。那么最后一个就是这个开发服务器呢,它是没有输出的。没有输出的意思就是来我们把这个load关掉啊,然后把这个Dis目录下的东西给删掉。删除,你看第一次目录,现在是空目录,但是我们代码运行还是正常的。同时我们重新再打包一下啊,重新在MPS WiFi。在运行。好,终止指定的终止这个程序的指令呢,是node的统一方式CTRLC,按CTRLC那就可以终止这个开发服务器啊。好,我们重新预习一下,它的第一层目录并没有任何输出。
05:01
这里就要说一下,开发服务器它是不会。输出。咱们的资源的,它是在内存中编译打包的。所以开发模式下,我们是没有任何输出的。也不需要有任何输出,因为输出的东西它长什么样子我们也看不懂,我们只希望它在浏览器能有效果就可以了。我们能看到效果,能运行那就完美对吧?所以开发服务器这种没有输出的形式才是我们最终想要的形式。好,那么这就是开发服务器啊,它的配置以及它的一个小的特点。嗯。
我来说两句