包配置
包是 Kissy 中很重要的概念,回顾下上一节的代码:
KISSY.config({
packages: [
{
name: 'bee-demo',
base: '../build',
ignorePackageNameInUri: true,
debug: true,
combine:false
}
]}
);
我所理解的包是对模块路径引用地址的定义,比如我的业务模块名是 bee-demo/index,那么该模块的加载地址是什么呢?
Kissy 默认加载的 http://g.tbcdn.cn/kissy/k/1.4.8/bee-demo/index-min.js 不符合我们的预期,我们希望 Kissy 加载 bee-demo工程下build目录文件。
PS:build目录为 gukp-kmc 编译源码模块文件存放的地方。
所以我们需要配置包,核心目的是配置 base 目录路径,将模块名称中的 bee-demo 映射到我们工程的 build 目录,这样 Kissy.use('bee-demo/index') 时就会自动找到 bee-demo/build/index-min.js 文件。
包配置参数说明
packages 为一个数组,即 Kissy 支持同时配置多个包,一个object即一个包配置,所有参数含义可以看官网文档,这里重点讲解几个参数:
name 包名,即模块名称路径起始,比如 bee-demo/index 中的 bee-demo
base 包所在的 url 路径, 如果是相对路径,就是相对于当前页面路径,Kissy会把模块名称拼接到 base 路径后
回顾下我们的目录结构:
我们在dev_index.html中配置 base: '../build' ,Kissy会把模块名称拼接到路径中,假设本地服务器地址是 http://localhost:63342/,最终请求的路径会是 http://localhost:63342/bee-demo/build/bee-demo/index-min.js 。
很明显这个路径是错的,build里面没有 bee-demo目录,这个设计非常坑,kissy1.2.0的代码都被逼得在发布目录加一层包名目录。
那么如何解决这个问题呢?
ignorePackageNameInUri:true 可以在请求的模块路径中省去包名!就可以解决上述问题。
combine 配置,会在后面专门用一节内容讲解。
debug 开启包调试,默认Kissy加载的是*-min.js文件(即压缩后的文件),debug设置为true,可以让Kissy加载*.js源码文件,后面讲到调试时再深入探讨。
留意:包名不一定只能是物理目录名,也是可以配置路径的,举个场景,我们bee-demo工程发布上线后带有版本号1.0.0,调用模块的代码会是:
KISSY.use('bee-demo/1.0.0/index');
但是我们的工程又没有1.0.0这样的物理目录,那包应该如何配置名称,才能保证我们在开发环境中正确的包指向呢?
其实很简单,只要配置 name:'bee-demo/1.0.0' ,配合包名忽略参数 ignorePackageNameInUri:true ,即可搞定。