daxingplay / kmc Goto Github PK

View Code? Open in Web Editor NEW

32.0 9.0 36.0 212 KB

module compiler for kissy

License: MIT License

JavaScript 99.89% CSS 0.11%

kissy kmc compiler

kmc's Issues

支持打包kissy的模块

需求来源于承玉
支持把一些kissy本身的模块打包到用户的脚本中，比如dom、event等，需要注意的是分析这些的依赖的时候一个文件内可能有很多的子模块

KISSY.NodeList.add方法导致模块无法被打包

例子：

KISSY.add(function(S) {
var triggers = S.all('.selector1').add('.selector2');
....
});

由于代码中调用了这个add方法，会导致整个模块无法被打包，但不会终端整个打包流程（感觉像是跳过了该模块）。

Unsafe use of eval

In file lib/index.js the following use of eval is dangerous

var requiredModules = eval('(' + requires[i]).requires;

A malicious package may place a require clause that would lead to code execution. Either validate all inputs passed to eval using a regex or use a more advanced sanitization library like:
https://github.com/cristianstaicu/eval-sanitizer

combo fix module name模式对css文件处理有误

see daxingplay/grunt-kmc#9 for more details

combo方法要给源文件加上模块名

模块互相require重复打包的bug

之前有做处理，但是这次发现如果两个模块中一个是入口文件就会有问题，应该是之前的处理位置不对

kissy的模块打包之后的模块名问题

kissy自带的模块，比如dom、event打包进来的时候不能添加包名。

kmc支持map功能

方便替换模块名

require模块路径是目录报错

require: ['pkg/mod/']

不知能否将java版ModuleCompile中将html模版文件(.tpl.html)转换为KISSY模块(-tpl.js)的功能添加进来。

不知能否将java版ModuleCompile中将html模版文件(.tpl.html)转换为KISSY模块(-tpl.js)的功能添加进来。

combo接口支持目录

input支持目录

支持生成 1.3.0 的 deps.js 文件

support require/exports/module

kissyteam/kissy#425

支持kissy 1.3+的包配置方式

即支持下面的这种配置包的方式：

KISSY.config({
    packages:{
        x:{
            // x 包的基准路径
            base:'http://x.com/biz/',
            // x 包的时间戳
            tag:'x',
            // 开启 x 包 debug 模式
            debug:true
        },
        y:{
           // y 包的基准路径
           base:'http://x.com/biz/',
           // y 包不开启自动 combo
           combine:false
           // 不配置 tag，则取 kissy 内置模块的时间戳
        }
    }
}

build输入目录时候可以指定排除哪些文件

@林谦需求：build的时候指定了目录，可以排除该目录下的一些特定文件，比如-min.js，-combine.js

require分析bug

{ 'requires': } 的方式（requires前面有引号之类的）解析会有问题

输出文件为什么没有压缩？

四个场景的bug

项目地址：http://gitlab.taobao.ali.com/trip/h5-tt/tree/daily/0.0.21

场景1

配置：

options: {
    // depFilePath:'build/deps.js',
    comboOnly: false,
    fixModuleName:true,
    comboMap: false,
    packages: [
        {
            name: '<%= pkg.name %>',
            path: './src',
            charset:'utf-8',
            ignorePackageNameInUri:true
        }
    ],
},

main: {
    files: [
        {
            expand: true,
            cwd: 'src/',
            src: [ '**/*.js', '!Gruntfile.js', '!libs/**/*'],
            dest: 'build/'
        }
    ]
}

输出

.
├── config.js
├── mods
│   ├── footer
│   │   └── index.js
│   └── header
│       └── index.js
├── pages
│   ├── detail
│   │   └── index.js
│   ├── list
│   │   ├── index.js
│   │   └── mock.js
│   └── telephone
│       └── index.js
├── test
│   └── abc
│       └── index.js
└── widgets
    ├── scroll-list
    │   └── 1.0
    │       └── index.js
    └── tabview
        └── 1.0
            └── index.js

错误：文件结构正确，为什么comboOnly:false，每个文件都执行了静态合并
应该只补全modName

场景2

options: {
    depFilePath:'build/deps.js',
    comboOnly: false,
    fixModuleName:true,
    comboMap: false,
    packages: [
        {
            name: '<%= pkg.name %>',
            path: './src',
            charset:'utf-8',
            ignorePackageNameInUri:true
        }
    ],
},

main: {
    files: [
        {
            expand: true,
            cwd: 'src/',
            src: [ '**/*.js', '!Gruntfile.js', '!libs/**/*'],
            dest: 'build/'
        }
    ]
}

输出结果

├── test
│   └── abc
│       ├── build
│       │   └── deps.js
│       └── index.js

为什么每个index.js所在目录下会多一个build/deps.js

场景3

options: {
    depFilePath:'build/deps.js',
    comboOnly: false,
    fixModuleName:true,
    comboMap: true,
    packages: [
        {
            name: '<%= pkg.name %>',
            path: './src',
            charset:'utf-8',
            ignorePackageNameInUri:true
        }
    ],
},

main: {
    files: [
        {
            expand: true,
            cwd: 'src/',
            src: [ '**/*.js', '!Gruntfile.js', '!libs/**/*'],
            dest: 'build/'
        }
    ]
}

输出结果

├── build
│   └── deps.js
├── config.js
├── deps.js
├── mods
│   ├── footer
│   │   ├── build
│   │   │   └── deps.js
│   │   └── index.js
│   └── header
│       ├── build
│       │   └── deps.js
│       └── index.js
├── pages
│   ├── detail
│   │   ├── build
│   │   │   └── deps.js
│   │   └── index.js
│   └── telephone
│       ├── build
│       │   └── deps.js
│       └── index.js
├── test
│   └── abc
│       ├── build
│       │   └── deps.js
│       └── index.js
└── widgets
    ├── autocomplete
    │   └── 1.0
    │       ├── build
    │       │   └── deps.js
    │       └── index.js
    └── tabview
        └── 1.0
            ├── build
            │   └── deps.js
            └── index.js

错误1：每个index.js旁边的build/deps.js不应该出现
错误2：每个index.js不应该被静态合并（因为comboOnly:fase）

场景4

options: {
    depFilePath:'build/deps.js',
    comboOnly: true,
    fixModuleName:true,
    comboMap: true,
    packages: [
        {
            name: '<%= pkg.name %>',
            path: './src',
            charset:'utf-8',
            ignorePackageNameInUri:true
        }
    ],
},
main: {
    files: [
        {
            expand: true,
            cwd: 'src/',
            src: [ '**/*.js', '!Gruntfile.js', '!libs/**/*'],
            dest: 'build/'
        }
    ]
}

结果：

├── config.js
├── deps.js
├── mods
│   └── header
│       └── mods
│           └── header
│               └── index.js
├── pages
│   ├── detail
│   │   └── pages
│   │       └── detail
│   │           └── index.js
│   ├── global
│   │   └── pages
│   │       └── global
│   │           └── index.js
│   ├── list
│   │   └── pages
│   │       ├── global
│   │       │   └── index.js
│   │       └── list
│   │           ├── index.js
│   │           └── mock.js
│   ├── news
│   │   └── pages
│   │       └── news
│   │           └── index.js
│   ├── news-list
│   │   └── pages
│   │       └── news-list
│   │           └── index.js
│   ├── query
│   │   ├── pages
│   │   │   ├── global
│   │   │   │   └── index.js
│   │   │   └── query
│   │   │       └── index.js
│   │   └── widgets
│   │       ├── checkbox
│   │       │   └── 1.0
│   │       │       └── index.js
│   │       └── radio
│   │           └── 1.0
│   │               └── index.js
│   ├── station
│   │   ├── pages
│   │   │   ├── global
│   │   │   │   └── index.js
│   │   │   └── station
│   │   │       └── index.js
│   │   └── widgets
│   │       ├── autocomplete
│   │       │   └── 1.0
│   │       │       └── index.js
│   │       ├── scroll-list
│   │       │   └── 1.0
│   │       │       └── index.js
│   │       └── tabview
│   │           └── 1.0
│   │               └── index.js
│   └── telephone
│       └── pages
│           └── telephone
│               └── index.js
├── test
│   └── abc
│       └── test
│           └── abc
│               └── index.js
└── widgets
    ├── autocomplete
    │   └── 1.0
    │       └── widgets
    │           └── autocomplete
    │               └── 1.0
    │                   └── index.js
    ├── checkbox
    │   └── 1.0
    │       └── widgets
    │           └── checkbox
    │               └── 1.0
    │                   └── index.js
    ├── loading
    │   └── 1.0
    │       └── widgets
    │           └── loading
    │               └── 1.0
    │                   └── index.js
    ├── radio
    │   └── 1.0
    │       └── widgets
    │           └── radio
    │               └── 1.0
    │                   └── index.js
    ├── scroll-list
    │   └── 1.0
    │       └── widgets
    │           └── scroll-list
    │               └── 1.0
    │                   └── index.js
    └── tabview
        └── 1.0
            └── widgets
                └── tabview
                    └── 1.0
                        └── index.js

文件结构乱掉了
deps.js 是正确的

带BOM头的文件打包有问题

如果文件带有BOM头，那么打包的时候会成问号：？

输入路径和输出路径一样的话无法打包入口文件

@隐若反馈：moduleCompiler.build的输入文件路径和输出文件路径一样的话，入口模块不会被combo进来

package的path可以使用url的形式

@maxbbn 提出的。

比如：
ModuleCompiler.config({
packages: [
name: 'abc',
path: 'http://a.tbcdn.cn/s/kissy'
]
});

build支持模块名

比如：
ModuleCompiler.build('pkgName/index')

分析依赖需要遍历所有子目录

@拔赤的需求，遍历文件夹的时候需要遍历所有的子目录，这样，每个模块文件都可以单独被use，讨论了一下，打包的时候单独增加一个参数解决这个问题。

require的css没有放置在dep文件中

css文件被忽略了貌似

增加analyze接口，只分析，不打包

增加analyze接口，只用来分析依赖，不打包文件，分析完毕后，以json格式输出。

css模块解析具体信息

daxingplay/grunt-kmc#6

在调用接口的时候，建议不要在控制台输出信息

感觉这是一种陋习~

build不配置outputfilePath的时候输出文件内容

build这个api，如果不配置outputFilePath的话，将文件内容带出来。

或者统一一下，都带出来

目标文件没有找到的时候有报错！

ubuntu 12.04 LTS
node:0.8.2
module-compiler:0.0.5

/home/qiaofu/node_modules/module-compiler/lib/index.js:471
        !self._config.silent && console.info('[err]'.bold.red + ' cannot f

TypeError: Cannot read property 'silent' of undefined

支持打包多语言模块

只抽取依赖不打包

kissyteam/kissy#429

添加silent配置，完全关闭控制台输出, 将打包信息输出为reporter

{
  mods: [{
    output: '/xx/page/xx-out.js', //输出
    name: 'page/xx',              // 主模块名
    path: '/path/to/mod',         // 路径
    submods: [
      {                           //所有被打包进来的模块
        name: 'utils/mods/a',     //被依赖模块名
        path: '/path/to/mod',     // 被依赖模块的路径　path of mods package
        status: 'ok'              // 模块状态 如：　missing, ok, error
      },
      {
        name: 'utils/mods/a',     //被依赖模块名
        path: '/path/to/mod',     // 被依赖模块的路径　path of mods package
        status: 'ok'              // 模块状态 如：　missing, ok, error
      }
    ]
  }]
}

combo方法支持目录打包

combo方法目前只支持单文件输出依赖文件。需要考虑支持目录打包输出依赖。

支持打包包名同名模块

比如

.
|-- menu.js
`-- src
    `-- control.js

这么配置：

kmc.config({
            packages: [{
                name: 'menu',
                path: './src',
                charset: 'gbk',
                ignorePackageNameInUri: true
            }]
        });

kmc.build('./menu.js')

那么menu.js的模块名就是menu/../menu，这是因为menu.js文件在包的外面所以不被支持。

理论上这种应该也是支持的：