node package manager

grunt-kmb

grunt-kmb

Grunt plugin for Kissy Module builder

基于 uglify-js 提供的 JavaScript 语法解析树(AST)之上的 KISSY 模块构建工具。

快速上手

npm install grunt-kmb --save-dev

安装完成后在 Gruntfile 里加载之:

grunt.loadNpmTasks('grunt-kmb');

The "kmb" task

Overview

在项目的 Gruntfile 中 grunt.initConfig() 里增加一个配置项命名为 kmb

grunt.initConfig({
  kmb: {
    options: {
      // Task-specific options go here. 
    },
    your_target: {
      // Target-specific file lists and/or options go here. 
    },
  },
})

示例

配置

grunt.initConfig({
  kmb: {
    options: {
      pkgName: 'h5-home',
      compress: true,
      comboRequire: false,
      addModuleName: true,
      depFilePath: 'build/map.js',
      // alias: 'src/config.js' 
      // alias: ['src/alias.js', 'mods/abc/alias.js'] 
      alias: {
        'util': {
          alias:['h5-home/widgets/libs/util']
        },
        'moment': {
          alias:['h5-home/widgets/libs/moment']
        }
      },
      ext: '-min'
    },
    main: {
      files: [
        {
          cwd: 'src',
          src: ['**/*.js',
            '!widgets/base/**/*',
            '!**/*/Gruntfile.js',
            '!**/build/**/*'],
          dest: 'build/',
          expand: true
        }
      ]
    }
  },
})

配置项

options.pkgName

  • Type: String
  • Default value: process.cwd()

要构建的包名,默认取项目目录名。

options.compress

  • Type: Boolean
  • Default value: true

是否压缩,默认为 true

options.comboRequire

  • Type: Boolean
  • Default value: false

是否将模块依赖合并到该模块,默认为 false

options.addModuleName

  • Type: Boolean
  • Default value: true

是否加上模块名,默认为 true

options.depFilePath

  • Type: String || NULL
  • Default value: build/map.js

生成依赖关系表文件路径,如果不需要生成设置为 null,默认为 build/map.js

options.alias

  • Type: Object || String || Array
  • Default value: {}

KISSY 模块别名配置,与 KMD 规范中的别名配置保持一致。

支持三种类型配置:

  • Object

    • 与示例中类似,标准键值对对象描述别名模块
  • String

    • 传入 alias 配置文件路径,以构建执行目录为起点
    • 配置文件内容参照:
    KISSY.config('modules', {
        'loading':{
            alias:['abc/widgets/libs/loading']
        },
        'moment': {
            alias:['abc/widgets/libs/moment']
        }
    });
  • Array

    • 支持指定多个 alias 配置文件
    • 后面的配置文件中别名模块的定义会覆盖前面文件中已定义的该模块

options.ext

  • Type: String
  • Default value: -min

构建后的文件名后缀,默认为 -min

对比

grunt-kmc 相比,速度上提升了__一倍多__:

  • 测试条件:以某项目为例,均执行批量文件构建,生成模块依赖关系表 map.js
  • grunt-kmc:
    • grunt-kmc
  • grunt-kmb
    • grunt-kmb

在高效执行的同时:

  • 对目标代码做了压缩,也就不需要 uglify 任务了
  • 处理了模块中 require 了 css 文件的情形,直接打到模块内

Release History

  • [0.0.1]

    • 初始版本,支持主要的构建场景和配置,提供 css 依赖合并,提供压缩配置项
  • [0.0.2]

    • alias 配置项支持多种配置类型
  • [0.0.3]

    • 处理模块无依赖的情形
  • [0.0.4]

    • 改进 alias 解析
  • [0.0.5]

    • 优化构建,去除不必要的换行符
  • [0.0.6]

    • 优化构建后的模块依赖合并注释,处理无模块依赖的情形
    • 优化模块已指定模块名处理逻辑
  • [0.0.7]

    • 代码压缩混淆改进
  • [0.0.8]

    • 处理文件列表为空
  • [0.0.9]

    • 将当前执行时生成的构建源码和映射关系表缓存,加速同一次构建任务中二次执行 kmb 任务速度(如构建线上包之后构建离线包,可复用构建线上包生成的临时构建后源码和映射关系表)
  • [0.0.10]

    • bugfix for build cache modules
  • [0.0.12]

  • [0.0.13]

    • 支持根据指定的部分入口文件生成基于这些入口文件的全量的依赖模块构建
  • [0.0.14]

    • 模块解析 try catch,便于定位解析出错的文件
    • 健壮性优化

License

Copyright (c) 2014 弘树. Licensed under the MIT license.