最新版本的angular-cli中已經支援搖樹優化，命令:

ng serve –prod –aot
這篇文章已經過時

1.先使用Angular-cli生成一個新的專案

 ng new angular2-aot-rollup-seed

2.建立完成之後，會自動生成一個根模組AppModule，為了說明問題，使用

 ng g module HomeModule
 ng g component HomeComponent

生成一個新的Home模組，並且生成一個新的Home元件

3.配置路由
AppModule中的路由配置如下：

const appRoutes: Routes = [
  { path: 'home'
 
,loadChildren:'app/home/home.module#HomeModule' },
];

然後需要在imports中使用 RouterModule.forRoot(appRoutes)匯入進來。這裡配置了非同步載入的方式去載入HomeModule

HomeModule中的路由配置如下：

const homeRoutes: Routes = [
  { path: '',component:HomeComponent },
];

上面都是基礎配置，配置完成之後，使用ng serve測試能夠正常啟動。

4.下面開始進行AoT編譯部分，先複製tsconfig.json檔案，並重命名為tsconfig-aot.json，然後修改為以下內容：

{
  "compilerOptions": {
    "baseUrl": "",
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es2015", "dom"],
    "mapRoot": "./",
    "module": "es2015",
    "moduleResolution": "node",
    "outDir": "../dist/out-tsc",
    "sourceMap": true
 
,
    "target": "es2015",
    "typeRoots": [
      "../node_modules/@types"
    ]
  },
  "files": [
    "app/app.module.ts",
    "app/home/home.module.ts"
    "main.ts"
  ],

  "angularCompilerOptions": {
   "genDir": "aot",
   "skipMetadataEmit" : true
 }
}

然後使用angular的ngc編譯器，進行AoT編譯，AoT編譯需要先安裝angular提供的ngc外掛，

npm install rollup rollup-plugin-node-resolve rollup-plugin-commonjs rollup-plugin-uglify --save-dev

之後可以使用以下命令來編譯

node_modules/.bin/ngc -p tsconfig-aot.json

windows下，使用以下命令

"node_modules/.bin/ngc" -p tsconfig-aot.json

之後會在和app目錄同級的目錄下生成一個aot資料夾，裡面的內容就是我們編譯完成的結果。

5.Rollup，使用以下命令安裝rollup外掛

npm install rollup rollup-plugin-node-resolve rollup-plugin-commonjs rollup-plugin-uglify --save-dev

然後複製main.ts，並且重新命名為main-aot.ts，將內容修改如下：

import { platformBrowser }    from '@angular/platform-browser';
import { AppModuleNgFactory } from './aot/app/app.module.ngfactory';
platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);

然後使用rollup命令進行搖樹優化

node_modules/.bin/rollup -c rollup-config.js

之後你就可以在專案根目錄下的dist目錄下看到生成了一個build.js的檔案。這個就是我們rollup之後的結果。

6.下面說遇到的問題

a).提示System.import is not function
這個是因為我在app模組的路由中，使用了loadChildren配置，這個配置裡頭，angular就會使用System去下載模組程式碼，所以需要在index.html中加上system.js檔案，這個在官方的例子中不需要，因為沒有用到非同步載入路由。

b).require is undefined
這個不記得了，記得了再加上
c).can not find home.module.ngfactory
這個是因為你使用了loadChildren來載入home模組，但是在AoT編譯的時候，是不會生成home模組的檔案的，所以我就在app模組中，手動匯入了Home模組，這個時候進行AoT編譯的時候就生成了home.module.ngfactory檔案了
然後重新rollup，生成的build.js就是可用了，應用正常啟動了，訪問/home能夠看到home works！的提示，控制檯無錯誤。

專案我已經放在github上了，有興趣的可以看看