00:01
下面呢,我们要进行统一命名配置。我们有很多地方进行输出文件的命名,包括图片,包括自己图标,包括GS,包括C,我们先统一一下啊,形成一个统一的命名规范,这样会更规范一点。我们先来回顾一下我们有哪些命名啊,我们有file name,这个output里面的file name命名,这里命名的是入口文件输出的这个文件名,有track file name,这是我们通过动态加载的时候,或者是not里面代码将会被打包成一个串,那么它的命名规则。然后往下走,我们还有这个图片,图片里面的这个命名规则和字图标等资源的一些命名规则,还有往下走,下面的还有打包样式的这个秘密规则。我们要做些修改。那么修改的时候,我们告诉他原因啊,首先这个入口文件打包的名字呢,我们不叫面了,我们取个中化用这个名字。用这个名字的好处就是,万一将来你改成多入口,那么这种名字是没有问题的,但是如果你改成多入口,还是叫面JS,那么就会有问题。
01:09
所以这种名字会比较好,而且默认名字呢,我们它默认的单入口就是叫妹,所以你这样写和写妹是一样的,反而还能金融多入口,所以更好一点。好,然后呢,创口内这样写其实没问题啊,但是这样写的话呢,我们打包输出的资源啊,大家前面也看到了,不容易区分谁是主文件。对吧,都叫may叫ma,感觉长得好像啊,好像,所以我们呢,给创这里加一个后缀啊,叫创这样的话呢,我就知道啊,哪个是主,哪个是创,所有是额外的文件呢,我们都会有一个串命名,而主的话呢,是直接是命名的。我们就这样去。好,再往下走的话呢,我们这里的图片和其他资源,它们的秘密规则呢,其实都是一样的哈,是只取十位,ET query啊等等都是一样的,所以我们可以想办法去复用它。
02:03
来,我们复制一份啊,怎么复用呢?我们可以统一在输出的时候,它有一个统一对其他资源做处理的access module。那么这个可以统一的对这些资源做梳理。呃,多了个引号啊。好,这里就是一些啊图片。字体。等通过type set处理的资源。啊,如果你通过type的数据资源,那么就会以这种方式去命名,这样就会统一了,我们都输出到media下面就好了。就不管你是哪种啊,都是media小,这样呢,就是统一他们的命名,这里两边就不用写两遍了,太费劲了。然后再往下走,CS这里呢,也需要做处理。CS这里呢也是啊,因为将来也可能多入口打包,可能会设置多个C文件,所以这里也是一样啊,我们选names。
03:08
同时,如果你动态导入到JS里面,如果也有CS,它也会生成创,所以我们要取这个创fair name。那么取的名字也是这里加个创就好了。当然,因为我们动态导入的GS没有CSS,所以目前这个命名还用不上,但是一旦有了,那么这个命名就用得上了。所以以上就是这些命名的一个方式啊,再说一遍。我们从下到上一点说啊,取内幕呢,就是因为万一将来改成多入口,那么我们这里就不会冲突。对吧,加这个的话呢,目的就是我们如果将来引入的动态导入的资源,它如果也有CS有样式,那么这里就会起到这个命名的规范。同时加一个窗口呢,就是为了和主文件进行区分。然后呢,这些图片和其他资源呢,他们规则是一样的,我们统一通过access modify name去处理。
04:05
这样呢,更方便一点啊,就写一遍吧,说白了。只要你将来是通过type这种方式处理的,那么都会通过它来命名。然后file name和name呢,和那个样式资源是类似的。到这里我们就处理好了,我们再重新打包。来,我们就观察打包叔叔的这个资源情况啊。OKJS呢,它打包的还是一样的,主文件也就是这样写的,而带串的文件会加个串,而图标图片和C图标呢,他们都打包到media了,因为我们都放在统一的目录了,都打包到这里面了,也是没有问题的。然后最后呢,把代码运行一下。啊,他最终所有效果也能呈现,所以没问题。好了以上呢,就是我们对这个打包的这个目录呢,进行了一些调整,确保它没有问题,那么这个调整的话呢,这些配置啊,在开发模式下,其实都是可以同样的做的,所以最后呢,我们把开发模式也改成这个效果。
05:15
来开发。来对它进行修改。看C啊,那么这一块就改好了,改好了之后呢,我们往下走,把这两块注释掉。因为他们都会走同样的秘密规则。那么再往下走一走的话呢,我们来看看下面,因为没有用上那个CS的处理,所以CS并不需要改,最后呢,我们可以NPM大来看一下开发模式下这个代码有没有其他问题。对吧,还是OK的。好了,以上呢,就是我们整个代码分割的配置了。
我来说两句