ngfis的bower生态模块安装插件

为何不直接用bower？

当前社区的模块质量良莠不齐，很多类库都不符合bower.json-spec,的规范，仓库里面经常有很多源码垃圾文件，甚至很多模块安装之后不可用或者根本安装不上。

@fouber 也曾多次提到「模块生态及版本管理是一个细思恐极的问题」， 所以scrat选择的方案是**「自建高质量的小范围生态」**。 对于社区的模块， 采用travis同步方式， 参见transform.js。

不过作为angular的拥护者， 丢弃bower总是觉得可惜， 同时发现angular的周边模块质量相对好一点。

于是经过多次的反复纠结，于是编写了该组件，可以较完美的满足我的需求。

安装说明

需配置fis使用，可以参见ngfis项目。

npm install ngfis-command-install --save

使用说明

• ngfis install
• ngfis install bootstrap zepto
• ngfis install angular-mocks --save-dev

支持的参数：

参数 | 描述 ------------ | ------------- -d, --directory [path] | 类库安装目录， 默认为component_modules，fis-conf配置项:settings.command.install.directory -c, --clean | 清除bower的cache缓存 --dev | 安装devDependencies开发模块 --no-save | 不保存到bower.json (跟bower不同，默认会保存) --save-dev | 保存到bower.json的devDependencies属性

原理说明

• 调用bower programmatic api安装依赖
• 根据mapping配置，使用glob规则来清洗目录文件
• 对应的修改或覆盖模块bower.json的属性

配置说明

对项目的bower.json增加以下属性的支持：

属性 | 类型 | 描述 ------------ | ------------- | ------------- ignoreDependencies | Array | 忽略的依赖，如需要去掉bootstrap默认依赖的jquery overrides | Object | key为类库名称， value为配置项， 包括mapping, main, exports等

• overrides.mapping | Array | 支持字符串和grunt.file的glob配置格式
• overrides.main | Array/String | 覆盖原main属性，如bootstrap只需要第一个css
• overrides.componentMain | String | 当main为数组的时候，需指定一个文件为主文件(release分析别名时用)
• overrides.exports | String | ngfis自动包裹define时用到

配置的优先级： 项目bower.json配置 > 插件内置bower-meta.js > 模块本身的bower.json配置

目前内置的mapping很简单， 试过zepto ui-router angular angular-bootstrap bootstrap等几个类库都可以支持。 如有其他需求， 可以提issue， 我会内置进去。

示例

{
  "name": "ngfis-showcase",
  "private": true,
  "dependencies": {
    "angular": "~1.3.7",
    "angular-touch": "~1.3.7",
    "bootstrap": "~3.3.1",
    "zepto": "~1.1.6",
    "ui-router": "~0.2.13",
    "angular-resource": "~1.3.8",
    "angular-route": "~1.3.8",
    "angular-bootstrap": "~0.12.0"
  },
  "devDependencies": {
    "angular-mocks": "~1.3.7"
  },
  "ignoreDependencies": [
    "jquery"
  ],
  "overrides": {
    "bootstrap": {
      "main": "css/bootstrap.css",
      "mapping": [{
        "cwd": "dist",
        "src": [
        "css/**.css",
        "!js/bootstrap.js",
        "fonts/**",
        "!**/*.min.*",
        "!**/*theme.*"
        ]
      }]
    }
  },
  "resolutions": {
    "angular": "1.3.8"
  }
}

运行效果：