00:00
上一节里边呢,咱们就讲了两个问题啊,第一个就是什么呢?我们和TS的第一次的见面啊,写了一下这个代码,第二个问题呢,咱们通过手动的方式编译了一下TS代码,最终产生JS的文件,在HTML文件当中去引入了一下是吧?那下边呢,咱们要讲的是另外一个问题,就是什么呢?通过Vs code可以自动编译GS代码。那这个操作该怎么做呢?首先啊。我在这边新建一个目录啊,这个目录我起个名字零一啊,叫做TS的第一次啊,啊,然后呢,我把刚才的这些代码呢,全都给它移植到这个目录当中去。哎,然后呢,再重新新建一个目录,这个目录的名字呢,是零二杠,然后TS在什么呢?V code中自动编译啊,这自动就是就要比这个手动强是吧。好。那怎么做呢?啊,首先我们应该生成一个配置文件ts con,菲格点Jason,那怎么生成呢?
01:03
找到我的Vs code,然后在它上边鼠标键终端当中打开。把这个命令呢粘贴过来。优惠券。好,然后呢,这个时候我们来看一下啊,它在这里边产生了一个ts con点文件点击进来,这里边是做了一些配置,我们需要改这么几个地方啊,第一个有一个叫做alt d,就输出的目录啊,把这个代码呢,咱们复制一份CTRLD就可以了。之后呢,我把这个注释改一下啊。那什么意思,我先给它换两个行,让大家看得更加清晰一些,然后把它打开啊,格式化一下。在这个位置呢,我写个GS什么意思啊,就是说把TS文件最终编译后放在这个GS的目录中,当然大家现在此时也可以看到,我当前这个目录里边根本就没有一个GS的目录。
02:00
当然呢,你可以在这鼠标键新建一个目录是GS这行,当然我不新建它也是可以的啊,一会它会自动创建,然后呢,还有一个地方就是这个位置叫script处,这是严格模式,我把这行代码呢也给它复制一份。啊,上边这个呢,我就先不要了啊。然后呢,在这个位置我把它变成false,这个叫做干掉严格模式。就是说不使用严格模式啊。好,然后呢,我把这个文件保存一份,保存完了之后呢,现在我的目录当中啊,目录当中只有这样一个ts con,飞哥点JS文件,按照这个笔记里边,我们接下来啊,修改完了这两个配置之后,然后我们现在接着来看啊,启动监视任务终端运行是吧,咱们来启动一下。在这个里边找到终端啊,然后里边有个运行任务,然后在下边找到显示所有任务,紧接着下边有一个什么呢?Tsc监视,点开它这就可以了,是吧?有什么效果呢?首先我们来看啊,比如说我在这边有一个文件叫index.html吧,然后里边我写个HT啊,最基本的HTML代码,这个删掉啊删掉不要了。
03:13
然后呢,我在这边再新建一个文件,比如说叫做index.ts是吧,那我里边就可以写这个TS的代码了,括号括号还这么来写啊。哎,那大家看啊,我这一保存,或者说刚才我在书写这个文件的代码的时候,大家可以看到GS的目录呢,自动产生了,并且里边有个index加JS文件是吧,然后里边有些基本代码,那现在呢,我在我的HTML当中可以去SQ标签诶引入。GS目录当中的index JS文件,那我就可以在这里边正常的去书写TS的代码了,是吧,非常的简单啊,那现在呢,同样的我们来做一个简单的演示,比如说来上一个function是吧,那我再来一个C吧,括号啊括号。里边我写个str最基本的代码啊,就先演示一下这块主要演示的问题是什么,就是这个VSQ当中自动编译成这个TS的文件变成JS文件啊,LTR啊,这块写上一个什么呢。
04:11
呃,啊,你好啊,你好。然后加上这是我们的str,那我再来一个变量啊,Let t等于啊,再来一个小甜甜是吧?那我再来一个conso.log括号啊,C hi。括号再来一个text啊,跟之前写代码是一样的啊,我把它保存一下,我保存大家可以看一下命令在执行,那index.js文件当中呢,就有了这些代码了,是吧?啊非常的正常,这是属于在Vs code里边自动编译成TS的啊,自动编译TS文件最终变成GS的啊,啊,当然了,我们在这边去打开这个目录。看一下效果。嗯,大家看一下还是有这个内容的是吧?啊好,刚刚咱们就讲了这么一个小问题,什么小问题呢?哎,在Vs code当中自动的去编译TS的文件啊好,我们先把它停一下。
我来说两句