00:01
那么经过我们刚刚的学习的话,我们对TS里边的一些呃类型声明已经有了一个比较深入的一个了解啊,就是我们现在这个类型声明,基本上往后再写的话,都是这么一个套路啊,各种各样的类型,只不过我们以后再用的时候,可能会有一些相对来说会复杂一些情况,可能我会要把这个多种类型给它组合到一起去使用啊,但是呢,现在这些都不是我们的重点了,因为这个东西我们已经说完了,所以我们下边的事儿的话,就是你们一定要把这东西给它整的熟悉一点,一定要多去写写,多去敲敲,但是我们经过这个短暂的一个学习的话,其实我们也发现我们TS一个问题,TS跟我们GS之前的不太一样,GS之前的话,我写完了代码以后,直接放到浏浏览器里,它就能执行了,而我们的TS呢,我写完了以后,我需要干嘛?诶我需要先执行一个tsc叉叉叉来对我们那个TS文件进行编译。
01:01
编译为GS,编译完了以后才能在我们的浏览器里去执行,这就变得很麻烦,这就使得我们之前已经习惯了GS那种节奏的同学的话,你整到TS你就觉得,哎呀,我的天呐,为什么这么麻烦,你像TS那样多好啊,这个这块整就很麻烦,而且现在我们只是写一个文件,那如果我写了一堆文件,那是不是我也要一个一个去编译啊,哎,实在是太麻烦了,所以接下来我们要说的内容是什么呢?诶说的内容就是我们TS一个编译选项,那通过编译选项实际上它就在做一件事,让我们编写TS变得更加的优雅,就是把一些以前我们需要手动去做的事儿变成什么呢?自动化去完成的,并且我们可以通过这些变异选项来对我们的TS做一些配置,什么配置呢?诶,比如说我希望我的语法有问题,我就不让你编译,比如说我希望把我的代码编译成ES6版本的,在这里边我们都可以进行配置,所以接下来的内容我们说的是一些,哎配置相关的内容,那为了把这个内容给它说明白了,那这里边我们先做一件事儿,什么事儿呢?因为我们之前的代码啊,我是直接放到这个差零一里的,那这样搞起来的话,就显得我们这个代码会有点这个凌乱,那这样啊,我做点小的措施干什么呢?哎,我创建一个新的目录,我叫做一个PT part part one,然后把我们刚才啊。
02:34
第一个基础的这些内容,我们放到这个part one。Part one里啊,直接给它放进去。诶,然后呢,我们这个新的内容呢,我们创建一个新的目录,我们叫做一个part,诶part two这个是我们的第二块内容,所以我们待会儿的内容都在这个里边啊,我们可以这么去做,或者我也可以直接把这个part two作为一个项目给它打开也OK,或者怎么打开,我们直接打开一个,诶叫什么呢?Open。
03:04
Open找到我们这个拆点01PART two干嘛呢?我直接把这个part two作为一个新的项目打开,这样也可以啊,也可以,那首先打开以后我们先回顾一下我们之前的东西啊,在这里我们先新建一个TS文件,TS文件我们直接来一个这个,诶,来一个app.ts随便整一个,因为它主要是演示了,重点不在它,我要想用它的话,我需要先TS.ts对它进行编译,编译以后产生的是一个GS文件,GS文件我们是不是才能执行啊,但是现在我们这个TS里什么都没有,我们写点东西吧,诶,Cancel,点一个log log一个hello,哎,然后的话我们在这再编译一次。再编译一次,编译完了以后,我们这个GS文件等会儿啊,这是刚才那个文件,我们稍微等一下,编译完了以后,我们这个代码它就出来了,哎,就出来了,但是的话,其实我们这个东西它会有点麻烦,麻烦在哪儿呢?
04:00
我改一次,我let一个A等于十改一次,我这就得对它进行重新编译,然后GS文件里边才会有谁呢?有我这个东西啊,我又改一个,我又来一个light一个这个,呃,Light一个B等于一个33,我又改了一个,我还得重新编译,每一次是不是都得进行重新编译啊,那我就希望什么呢?我就希望我们的这个TS啊,它的编译器可以自动监视我这文件的变化,当我这个文件发生变化的时候,它就自动的对我这个文件进行重新编译,那要怎么办呢?诶在这里边我们有个命令Type C点一个app.ts这是我们之前的用法,在后边我们可以加一个杠W一个这个指令的一个选项,W表示什么意思?表示的是watch,当我们加上W这个选项以后,我们的TS编译器,它会自动的去监视我们这个文件变化,我先回车啊,你看效果,现在你看啊,我这。
05:00
这命令行就卡在这儿了,人家写了叫什么呀?哎,叫starting comple in watch model,就是开始我们这个编译模式,在这个监视模式啊,监视模式了,那监视模式什么效果,现在看我这个TS文件没改呢,GS文件没有变化啊来,我在TS里边,我们加一个light,一个C,等于一个hello,我加了一个变量,这时候你稍微等一下啊,它是有一个间隔的,它这会有一个这个执行效果,然后你再看这个TS稍微等一下。哎,你再看。发现什么了,他是不是你看这写了,发现这个文件发生改变了,开始干嘛执行这个变异,你看我这个C是不是就就有了,哎,所以加上这个W选项以后,它就这么一个效果,当我们这个文件发生变化的时候,它会自动去监视到这个文件的变化,并将这个变化应用到我们这个最新的这个GS文件里啊,当然它会有一个时间间隔,它并不是说我写完了立刻就给它编过去,它有一个时间间隔,所以这个时候我们需要稍微的等一下啊,当然我们你像这种是一个比较极端的情况,我这刚写完一行代码,我就去看它没有那么快,对吧,没有那么快,所以我们需要等一下,那这样的好处就是以后我们再写代码的时候,我们就不用再去手动编译了,他是不是就给我们自动去完成了,哎,但是呢,它也有一个问题,什么问题呢?就是它这个自动编译啊,它只是对我们当前文件。
06:27
如果我这还有一个TS文件,比如说我叫一个index.ts它里边也有一个代码,一个D等于一个这个,哈哈哈哈,随便写一个,那这个时候注意,当我这个D发生的时候,它是不会被监视,因为刚我们监视的是这个dex,这个T,而没有监视dex,所你行T时候编译完了以后,隐ex下边是不是才出现这个GS啊,你说老师我想监视隐ex怎么办?那我就TXC隐ex点一个TS-W,这样就对它进行监视了,就这么一个东西,但是很明显你会发现这个问题了,什么问题呢?哎呀。
07:14
你看啊,我这是两个文件,两个文件我是不是开了两个命令行,哎,注意第一个命令行是监视我们的这个app.ts第二个命个ex点们注意个文监关了,你说我这把它关了,监视也就没了,你说把它一插子一关了啊,你看是不是问你是不是中止啊,你终止。就完事了,他就不会再去监视这个文件了,这儿也是一样,你开开了你就不能关,关了以后监视这个东西就就没了,所以就意味着我们一个文件就得开一个窗口,一个文件就得开一个窗口,我如果十个文件就得开十个窗口,我如果有100个文件呢,就得开100个窗口,所以这种方式很明显也是不适合我们日常的一个开发的啊,那怎么办?首先我们先把刚才对我们这个app.ts的监视给它关掉,怎么关呢?CTRLC。
08:13
哎,终止我们这个命令行,稍微等一下,他需要把它这个监视给它关掉,关掉以后,哎呀。刚才是没人上啊,哎,给它关掉,关掉以后的话,现在这个文件再改变,它就不会去应用了啊,我们先把我们这个编译过这文件,我给它删掉。删掉啊删掉,也就是说现在没有编译好的文件,那我们希望什么效果呢?我们希望的效果就是我只需要执行一个命令,他就可以把我这个里边的所有的TS文件全部都给我编译成GS,诶那这样就是一步,是不是把所有的文件都编译,我们的工作就会简化很多呀?哎,那怎么做呢?很简单,其实我们只需要执行一个tsc的这么一个命令,直接执行这个命令,它就会自动的把我们这个所有的文件全都给我们编译完成啊,全都给我们编译完成。
09:09
但是现在我不能执行,现在执行没用啊,现在执行没用,为什么呢?因为我们能使用tsc这个命令来编译所有文件的前提是我们的项目目录下必须得有一个TS的一个配置文件,这个配置文件的作用什么?就是来配置我们这个TS的一些编译的信息的,它会根据这些信息对文件进行编译,所以你要想使用tsc来编译所有文件,你首先需要在项目下新建一个叫做什么呢?叫做ts con点杰son这个文件啊,你需要新建一个这个文件,在我们的web里直接就有这个选项,你直接创建就行了,如果你用的别的编译器没有,没有怎么办呢?没有你就手动拼一下就完事了啊。ts con ts就是我们的ts con叫配置点,是扩展名,它是一个JS文件,直接一点这个文件是不是就创建完了,诶创建完了,创建完了以后,我们这个文件它会给你一个默认结构,这个是webto给我们生成的,我完。
10:09
全可以全都给他删了啊,全都给删了,那但是既然是接子嘛,我给它留一大块啊,表示它是一个接子,别的东西我全都不写,有了它以后,我们这个TC就能用了啊,不能用了,你说老师这里面什么都没写呢,哎,什么都没写也能用啊,也能用,所以加完这个配置文件以后,我直接输入TC,然后回车,这个时候你会发现神奇的事情出现了,你们稍微等一下,你会发现什么呢?你发现app.ts还有inex.TS是不是都编译成这个GS文件,哎,都被编译了啊,都编译了,那这样的话,我们是不是一个命令就编译了所有文件呀?哎,甚至说你直接来一个什么呢?我这直接来一个tsc-W,你看啊,后边不文件名,这个时候它也会进入到一个监视模式,那这个时它监视的什么呢?监视的就是我们所有TS文件,你看啊,我把app.ts改了,我来一个light一个哈哈,诶等于一个这个等于一个这个77,诶然后呢。
11:09
哎,我这来一个light一个嘻嘻,诶,嘻嘻,等于一个这个,哈哈,哎,等于一个这个,嘻嘻,随便写一个啊,那这个时候注意这两个文件实际上它都会被什么,你看哈哈出来了,再看我们的index这西西是不是也出来了,诶这两个文件都被监视,所以说白了,当你加了这个ts conf文件以后,这个时候你再去编译的时候,你就不用再去说我一个一个编译,直接就执行一个TC就会编译所有文件,而tsc-W它就会直接去监视所有文件,啊我先给他停上啊,先给他停下,直接TC-W就OK了,就OK了,但是重点并不是说它这个东西用起来实在是太简单了,实在是没有什么好说的,但是关键点就在于我们刚才是不是创建了一个TS这个杰森文件呀,哎,这个杰森文件关键点,我们要来说一下这个森文的。
12:09
作用,它有什么作用,这个阶层文件比较有意思,它里面可以直接去,诶可以直接去写一些这个注释,通常有一些森的话,我们是不能写注释的,但是我们TS这个这个杰森,我们可以在它里面写注释,那这个ts con这个杰森是干嘛的点杰森是什么呢?是我们TS编译器的一个配置文件啊配置文件我们的TS的编译器可以什么呢?可以根据它的一个信息,诶,来对我们这个代码进行编译啊,对代码进行编译,那这里边我们可以有哪些配置啊,有哪些配置?哎,那这个就是我们接下来要说的内容,首先要明确一点,既然是一个阶层文件,外边是一对大括号,这是肯定的,有点类似于我们HTM跟标签,所有的配置信息都要往这个大括号里边去写,那么接下来我们要研究的就是它有哪些配置选项,哎呀,它这个配置选项啊。
13:07
还挺多的啊,还挺多的哎,但是别着急,我们一个一个来说,那我们对照着我们的这个,哎,笔记我们来说一下,哎,配置选项的话,首先我们说最外外层的,什么叫外层的,就是直接往这个外层的大块里写的啊,大块里写的有这么几个啊,我们先说这么两个,一个叫做include。哎,一个叫做exc include啊,Include什么意思?Include叫做包含,什么叫包含呢?哎,我们说了啊,你在这儿如果直接执行tsc命令啊,直接执tsc命令,它默认是编译我们目录下的所有TS文件,所有TS文件你有一个就编译一个,有十个就编译十个,但是其实我们真正在开发当中,是不是说我所有的TS文件我都需要编译啊,诶不一定啊,不一定,所以这个时候我们这个选项它的作用就出来了,叫什么呢?叫de叫什么呢?叫包含啥意思,就是来指令。
14:12
In includede用来什么呢?哎,用来指定哎,用来指定哪些我们这个TS文件需要,哪些这个TS文件需要被编译啊,哪些TS文件需要被编译啥意思?诶,比如说在这儿我写一个啊,你看因可德我们写完了,它这个结构就给你整出来了,它是不是一个数组啊,哎,数组数组表示说它这里边的参数需要的是一个路径啊路径比如说我写这么一个斜杠src,斜杠星星,斜杠星斜杠星,那这个表示什么意思啊?首先注意啊,我们在写路径的时候,如果你写的是一个星,一个星表示的是任意文件啊任意文件,两个芯儿表示的是任意的目录啊任意目录,所以这个时候表示什么意思?哎,表示的是我们根目录下的src目录下的任意目录下的任意文件都会被编译,所以这个时候你注意啊,我把这两个文件给它删了,就是我把这个。
15:12
GS给他删了。那这个时候我们来看啊,在PART2下边,我们先这么写,先这么写啊,然后我再执行这个TC回车,直接执行,这个时候你看啊,它就这个。报错了对吧?就报错了,这是干嘛呢?诶,No input funds in con file啥意思呢?哎,你看啊,我加上这个配置选项以后,表示什么意思,表示说我只去编译src这个目录下的文件,你看这两个文件有没有给你编译,没有给你编译,但是报错了,为什么?我这里边有SC吗?没有src它是不是找不到啊,哎,所以就给你报错了,那怎么办呢?在这儿我们来创建一个src这个目录,Src里面我们随便写一个,写一个TS,我叫做一个app.ts还是我直接cancel.log,我来一个hello啊,咱们简单写一下意思意思,然后在这儿我再执行tic,我们再看效果回车。
16:13
再看啊,诶,这时候你看是不是就不报错了,哎,那你注意了,我们来看诶src下的ap.gs是不是就被编译了,而我们根目录下的点TS还有index.ts不是就没有被编译,哎,没有被编译啊,所以这个东西我们叫做一个in,哎,Include include表示什么意思?指定我们要编译的这个文件啊文件,那这个时候我们就可以把这两个删了啊,把两个删了,我们现在不用它了,我们就直接全都放到src里就行了啊,所以注意啊,我们编写路诶,用来指定是哪些文件需要编译,你后边如果还有别的路径,你可以写多个啊,你可以写多个,现在我只有一个,我就直接写一个这个src就行啊,SR行了,那这里面注意啊,我们这个路径选项,你要需要注意,我们这个星表示什么呢?星星,哎,或者这么写吧,斜杠星星表示什么呢?表示任意目录,而我们这个斜杠星星吧,而我们的星呢。
17:13
新而表示的是我们任意文件。哎,表示任意文件记一下就行啊,这个东西我们叫做include include,然后有include,还有一个什么呢?还有一个东西我们叫做exclude。Excludeclude表示的是包含,Exclude呢,正好相反,表示的是不包含啊,不包含啥意思呢?哎,比如说我在src里边有一个目录,我叫hello hello里边呢,我有一个哎,有一个这个TS文件,哎,TS文件,TS文件呢,我就叫做一个hello,点一个ts hello.ts里边我们来一个can,点一个黑黑。嘿嘿。这个时候啊,我们先什么也不设置,我们就把它这个刚才就刚设置了一个这个includede嘛,对吧,Includede,那这个时候我们还是对它进行编译,这个时候的话,其实你会发现我编译完了以后,APP被编译了哈,干嘛呢?它也被编译,为什么呢?因为我们这个路径就表示什么意思,就表示的是我们任src里边的任意文件对吧,任意文件,所以哈也在src里,所以哈点TS也被编译了,但是有一些情况下,有一些文件我们是不希望它被编译的。
18:32
不希望它去编译的,因为这文件我们可能有别的作用,但是我们不希望被你去编译,那我们就可以用这个if exclude来对这个文件进行排除,怎么写呢?比如说在这我可以这么写,直接来一个斜杠src,斜杠下边的hello,斜杠星星,来一个斜杠星,那这就表示什么意思?诶表示说诶我除了哈下的文件啊,除了哈下文件,也就是哈下的文件,我们不需要编译啊,不需要编译在这儿我直接执行一个TC这个命令,这个时候我们再看效果。
19:09
你再看,哎,那这个时候你看app.ts编译了,Hello,是不是就没有被编译,哎,没有变译啊,叫做exclude X干嘛呢,叫做我们被排除的文件。哎,就是什么呢?诶不不需要不需要被我们这个编译的这个,哎目录啊,编译的这个文件目录,那这个东西啊,我们一般呢,我们不需要去设置,一般情况下不需要设置,因为我们一般哪些东西不需要编译的,哎其实像我们如果用了note GS,我们诶用这个什么呀,会引入一些node模块,像node modus这些目录,我们是不希望被编译的,所以它实际上这个东西它是有默认值的,我这给你粘过来。这个是它的这个默认值。默认值,所以的话,一般如果你只想排除的是这些目录的话,那其实这个xclude的我们其实都可以不去设置啊,都可以不设置,所以这个我们可以认为是可选的啊,你是要你设不设置呢,它都行啊都行啊xclude,然后呢,下边我们再看excclude,完了以后呢,还有一个叫做X tenten的话,其实我们在这儿我就不演示了,为什么不演示,因为现在的话对于我们来说没什么用,什么叫ten呢?Ten叫做继承,继承是干嘛的?就是说白了,其实就是当我们这个诶配置文件特别复杂的时候,我不想重复写,比如说我有两个配置文件,一个叫什么呢?一个叫做TTS杰森,还有一个叫什么叉叉点杰森,那我想干嘛呢?我想把叉叉点东西放到这个TS里,但是我又不想再写一遍,那我就可以用这个干嘛呢?诶去继承一下就行了,就是就跟我们那个,就跟我们那个引入一个外部文件效果是一样啊,效果一样的。
20:55
你可以自己去设置一下啊,试试试一下,我这儿就不演示了啊,然后第四一个叫做files files我也不演示了,Files什么意思?Files叫做文件,它的使用方式就是这样的啊,文件你看file后边跟着一个中号,中号中号中号一个文件,它跟谁有点像呢?跟include有点像,Include是直接设置文件夹的,设直接设置目录的,对吧,我要包含哪个目录里边的文件,而files呢,是直接把一个一个文件给它设置出来的,就说你要编译哪些文件,你要编译哪些文件,直接给它设置就完事了,但是很明显啊,File有点麻烦,为什么呀?因为files列的是一个一个文件,我不可能把我每一个文件是不是都列出来,诶,所以files通常用在一些比较小的东西上啊,你项目里边比较少,就俩文件,你可以用files,所以一般情况还是用不上的,所以外边这层的话,我们在这说啊,现在我们这一共其实介绍四个include exc include,还有一个我们这这个extend,还有一个这个files。但是其实。
21:56
最主要我们现在要了解的就是一个include,还有一个exc includede exclude,其实都还好,最最主要的其实主要就是这个什么呀,哎,Include啊,Include includede,好,那关于这个配置文件啊,我们先说这么多,其实再往下最麻烦的是谁呢?诶,选项最多的是我们下边这个compel,这个options,它里边会有一堆的选项,这个是我们接下来的重点,但是还是那句话,不着急,先把我们刚才说这个几个选项熟悉一下,诶先了解一下它的一个作用,待会儿我们再来深入研究一下其他那些更实用的配置选项,好,我们先来评一下。
我来说两句