vkitty/docs/技术文档.md

hello kitty

# 技术方案

## 数据模型
```JavaScript
var actionFiles = [
    {
        file: "/Users/mebx/git/fudongguang/v-kitty/test/index.html",
        ext:".index.html",
        cdnUrl:"https://si.geili.cn/ffs2i2n121n112o90811.js",//cdn地址,
        name:"./index.html",
        destFile:"",//build后生成的文件
        mtime:"xxxx-xx-xx",//最后修改时间
        content:"xxxx",//文件源码 图片没有
        compile:"",//编译后的内容 图片没有
        isNew:false,//默认是true,
        param:"",
        options: {
            cdn: "@@cdn@@/index",
            title: "猜你喜欢"
        },
        actionFiles: [
            {
                content: "a11111111"
            },
            {
                file: "/Users/mebx/git/fudongguang/v-kitty/test/index.js",
                ext:".index.js",
                cdnUrl:"https://si.geili.cn/ffs2i2n121n112o90811.js?v=123&a=123",//cdn地址,
                param:"?v=123&a=123",
                name:"./index.js",
                destFile:"",//build后生成的文件
                mtime:"xxxx-xx-xx",//最后修改时间
                content:"xxxx",//文件源码 图片没有
                compile:"xxxx",//编译后的内容 图片没有
                isNew:true,
                actionFiles:[
                    {
                        content:"a222222"
                    },
                    {
                        file:"/Users/mebx/git/fudongguang/v-kitty/test/index.less",
                        ext:".index.less",
                        cdnUrl:"https://si.geili.cn/ffs2i2n121n112o90811.css",//cdn地址
                        param:"",
                        name:"./index.less",
                        destFile:"",//build后生成的文件
                        mtime:"xxxx-xx-xx",//最后修改时间
                        content:"xxxx",//文件源码 图片没有
                        compile:"xxxx",//编译后的内容 图片没有
                        actionFiles: [content,file,file,content], //最后一定是 [content]
                        isNew:false,
                        option:{
                            cdn: "@@cdn@@/index",
                            title: "猜你喜欢"
                        },
                        loaders:["less","minify"]
                    },
                    {
                        content:"b222222"
                    }
                ],
                loaders:["bable","minify"]
            },
            {
                file: "b111111"
            }
        ]
    }
];
//require不能有options,同事 require的 loaders只能是['_require']
```

## 模型数据介绍
```JavaScript
var actionFiles = {
    "/Users/mebx/git/fudongguang/v-kitty/test/index.js":{
        file:"/Users/mebx/git/fudongguang/v-kitty/test/index.js",//文件名称
        cdnUrl:"https://si.geili.cn/ffs2i2n121n112o90811.js",//cdn地址,
        destFile:"",//build后生成的文件
        mtime:"xxxx-xx-xx",//最后修改时间
        content:"xxxx",//文件源码,原始状态 图片没有
        compile:"xxxx",//编译后的内容 图片没有
        options: {
            cdn: "@@cdn@@/index", //cdn是保留字,不能用在自定义变量上面
            title: "猜你喜欢" //自定变量title
        },
        actionFiles:[
            {
                content: "a11111111"
            },
            {
                actionfiles
            }
            {
                content: "b11111111"
            },   
        ]
    }
};
```

## 整体技术方案
1. 解析文件,每次都生成新的模型数据
2. 解析单个文件时,发现mtime没有变更(如果mtime变更,但是content没有变),assign老的文件模型数据,并进行isNew=false打标.
3. 对isNew打标的数据进行判断,然后冒泡处理变动的文件,用loaders来编译数据.

## cdn处理方案
1. config.cdnUrl //cdn地址设定 用以替换 @@cdn@@
2. 如果_include选项中没有不是以文件名结尾,那么在后面增加hash文件名
```javascript
_include(cdn('./a.js'),{"cdn":"@@cdn@@/index"})
```

## 配置
```JavaScript
var config = {
    cache:true,//是否开启缓存,默认开启,加速编译
    tag:'_include',//引入tag
    baseDir:__dirname.replace(/\/node_modules.*$/,''),//项目根目录
    cdnUrl:"https://baidu.com",//cdn地址路径
    varTag:{
        open:'@@',//变量开始符
        close:"@@"//变量结束符
    }
};
```

## require 方案
1. require的代码自动执行
2. 代码执行require要方便处理
3. 执行后要返回module.exports

### 数据模型
```JavaScript
//执行模型
(function(modules){
    function _kitty_require(moduleId){
        var module = {
            exports:{},
            id:moduleId
        };
        modules[moduleId].call(module.exports,module,_kitty_require);
        return module.exports;
    }
    return _kitty_require(0);
})([module,module]);
```

```javascript
//module模型数据 同主数据模型,增加了下面模型数据
actionFile.mid=111;
//同时 actionFile.loaders=['_require'] 不能自定义设置
```


## 错误追踪
console.log(actionFile.file)