00:00
大家好,我是学习园地的科学讲师高若峰,上节课呢,咱们处理了csi兼容性,当然csi兼容性的处理,嗯,CI的处理啊,还有很多咱们需要做的,你比如说这节课咱们就看一下压缩CSS,咱压缩CSS呢,可以像压缩RTM一样,你可以单独指定去空格啊,去注释啊,但默认的这些都帮我们操作了,所以呢,也不用配置的那么细,对吧,咱们压缩肯定这些东西全去掉对吧,空格也去掉啊,像csi去掉啊,那后边的咱们讲数的时候和GSS和那个加va串的咱们会呃一起讲,就比如说去除无用的呃,CSS,你就消除一些无用的CSS。也以及消除无用的JS代码的时候,那个时候咱们一起说,在优化的时候咱们再说,那咱们先,呃,这节课呢,咱主要是看一下压缩CSS。需要使用的插件是这个。插件还是比较长的啊,优化CSS这个外派这一个插件,然后我们第一步肯定也是一样的,干嘛呀,先清除,然后NP mi安装。
01:01
右键粘贴一下啊,这个能粘过来可以啊B也是在嗯,开发的时候咱们去使用对吧。在这儿。那优化的时候呢,这个压缩还是比较简单,你看我们默认的实际上是没有压缩,对不对,那比如说我们在这里边,在原文件里边我们写点注释。比如说这些都是对吧。这里边儿随便加点东西吧。随便加点东西,比如说他不要的样式,咱把它注释掉了,对吧,这就是注释的方式,那这个是插件,插件呢,我们就有几种办法去用,对不对,第一个。不是几种办法,一般的咱们这个插件,因为它不是用loader去处理的,直接用插件处理的,所以呢,我们直接一块包含。什么这个插件op啊叫什么。太长了,我记得我粘贴。在这。
02:00
你们试一下,登记一下。诶,拿过来。这里边先把插件引入。插件引入,然后一会一个。Cost。翻过来等于。把它的大写的全变成把这个杠线去掉,变成不支持这个。去掉。变成驼峰式命名。插件引用加一部分使用,这个是在这里边使用的插件,那我们直接用这个对象就可以了。嗯,这里边啊。鉴定这个对象全用默认的,它默认的能给我们去除什么来?就简单这两步就搞定,就是用一个插件,他不用的。好,这个我们来看一下生成这个CSS是什么样的啊,就是这样的一个情况。注释的都给我们去掉了,空格给我们掉了默认就可以了,所以呢,你也不用再往下去配置,不用加大学习难度,在这里边再加上一些插件啊,然后再一个一个处理啊,直接这个就是能达到咱们想要的效果就可以啊,当然那个在开发环境里边。
03:14
你尽量先别去掉,这样的话,我们在看的时候呢,你就不太好处理了,对不对,真正上线的时候,我们再去处理这个优化,再使用这插件就可以了。这块先注册掉吧,先注释掉。插件放在这块,但是我们注着调,就是在内运用这个插件对不对,运用这个插件的时候,那我们看一下,这样我们能看清楚,能看清楚代码对吧,能看清楚。还好一点,但是怎么个压缩过程告诉你了,这样的话,咱们HTML你可以压缩了,GSS你可以压缩了,对吧,GS你也可以压缩了,那我们还有图片对吧,这也是一个,也是一个资源,当然了,我们还得去除无用的这样的一些代码。那这样的话,我们呃,主流的HTMLCSS,还有GS这样的一个呃,打包工具就完成了。
04:02
那下节课呢,我们再去处理其他的,你比如说还有资源,还有图片的资源,也是我们常用的,除了图片资源呢,还有其他资源啊,谢谢大家,这节课我们就讲到这里,内容比较少了。
我来说两句