Skip to content

Add Extension Steps

Jump to bottom Edit New page
leeight edited this page Mar 14, 2014 · 13 revisions

按照 #125 里面的讨论，对于要发布的edp-1.0.0，它提供的功能都通过扩展的方式来实现，从而可以极大的减少edp的体积，方便安装和升级。

对于现在已有的edp的一些扩展模块，我们需要进行一定的改造，才可以在edp-1.0.0里面正常使用。

使用方式

调用edp相关功能的时候，一般都是有如下特征的：

edp <cmd> [<sub-cmd> <sub-sub-cmd> ...] [arg1 arg2 ...]

<cmd>有builtin command和user command的区分。

命令的执行过程

主要分为两个阶段：Lookup Package, Command Execution。

Lookup Package

function LookupPackage( cmd, extensions ) {
  for ( var pkg in extensions) {
    if ( extensions[ pkg ].indexOf( cmd ) !== -1 ) {
      // builtin command
      return pkg;
    }
  }

  if ( extensions[ 'edp-' + cmd ] != null ) {
    // builtin command
    return 'edp-' + cmd;
  }

  // user command
  return 'edpx-' + cmd;
}

Command Execution

function CommandExecution( pkg, args, opts ) {
  try {
    require( pkg );
    var mod = FindCommandNode( require.resolve( pkg ), args );
    if ( mod && mod.cli && mod.cli.main ) {
      mod.cli.main( args, opts );
    }
  } catch( ex ) {
    InstallFromNPM( pkg ).done( function(){
      CommandExecution( pkg, args, opts );
    }).fail( function(){
      edp.log.error( "Failed to install %s", pkg );
    });
  }
}

改造已有的模块

#141 #145 #147 #148 #149 #155 ...

按照这里的讨论记录，我们将现有的命令进行了归类：

{
  "edp-core": [ "install" ],
  "edp-config": [ "config" ],
  "edp-build": [ "build" ],
  "edp-package": [ "import", "search", "update" ],
  "edp-project": [ ],
  "edp-lint": [ "htmlhint", "csslint", "jshint" ],
  "edp-beautify": [ "beautify" ],
  "edp-doctor": [ "doctor" ],
  "edp-minify": [ "minify" ],
  "edp-test": [ "test" ]
}

目录结构

目录结构一般遵循这样的规范：

edp-foo/
  README.md
  package.json
  lib/
  cli/
    foo.js
    foo/
      bar.js

edpx-bar/
  README.md
  package.json
  lib/
  cli/
    bar.js
    bar/
      foo.js

当执行edp bar的时候，按照LookupPackage的逻辑，我们会安装edpx-bar这个npm package，然后执行默认的命令cli/bar.js。同样的逻辑对于edp foo也适用。

开发的方式

  1. 从ecomfe里面fork对应的模块
  2. git checkout 你的repos
  3. git checkout -b issue-123
  4. git push origin issue-123
  5. 发起pull request

edp-bcs

  • + edp-bcs/cli/bcs.md
  • + edp-bcs/cli/bcs.js

edp-config

  • + edp-config/cli/config.md
  • + edp-config/cli/config.js

edp-build

  • + edp-build/cli/build.md
  • + edp-build/cli/build.js

edp-lint

  • + edp-lint/cli/csslint.md
  • + edp-lint/cli/csslint.js
  • + edp-lint/cli/htmlhint.md
  • + edp-lint/cli/htmlhint.js
  • + edp-lint/cli/jshint.md
  • + edp-lint/cli/jshint.js

其它的依次类推，不再赘述，改造的过程中，记得保证完善每个模块的UT代码，至于如何写UT，可以参考这里。

调试模块

恩，上面的内容我大概看懂了，假如我要修改的是edp-bcs模块，应该怎么调试呢？

最简单的办法：

git clone https://github.com/ecomfe/edp-bcs.git
cd edp-bcs && git checkout 1.0.0-dev && npm install .

git clone https://github.com/ecomfe/edp.git
cd edp && git checkout 1.0.0-dev && npm install .
npm link ../edp-bcs

最终的目录结构是这样子的

work/
  edp/
    node_modules/
  edp-bcs/
    node_modules/

然后切换到edp目录，执行node lib/cli.js bcs -h即可。

新的模块

Dev-Steps

Hello edp

Hello World

Clone this wiki locally