2017-05-23 9 views
1

を私はAOTコンパイルした後、角度2のアプリのためにツリーを揺るがすを使用しよう、と私は次のメッセージをキャッチ:Angular2 - ロールアップツリー(* .ngfactory - 解決できませんでした)揺れ

「コンテナ/モジュールoptions.globalsで 『コンテナ/ module.ngfactory - .ngfactoryは」

名前が外部モジュール用に提供されていない外部依存として扱うコンテナの\ module.aot.js、 によってインポートされますが、解決できませんでした』 - 'Containers_module_ngfactory'を推測する

これを修正する方法がわかりません。

このmodule.aot.js AOTコンパイル後コードである:

import { enableProdMode } from '@angular/core'; 
enableProdMode(); 
import { platformBrowser } from '@angular/platform-browser'; 
import { ModuleNgFactory } from 'Containers/module.ngfactory'; 
platformBrowser().bootstrapModuleFactory(ModuleNgFactory); 
//# sourceMappingURL=module.aot.js.map 

ロールアップ-config.jsの

'use strict'; 

import nodeResolve from 'rollup-plugin-node-resolve' 
import commonjs from 'rollup-plugin-commonjs'; 
import uglify  from 'rollup-plugin-uglify' 

export default { 
    entry: './Containers/module.aot.js', 
    dest: './module.vendor.js', 
    sourceMap: false, 
    format: 'iife', 
    onwarn: function(warning) { 
     // Skip certain warnings 
     if (warning.code === 'THIS_IS_UNDEFINED') { return; } 
     if (warning.code === 'EVAL') { return; } 
     console.warn(warning.message); 
    }, 
    plugins: [ 
     nodeResolve({jsnext: true, module: true}), 
     commonjs({ 
      include: 'node_modules/rxjs/**', 
     }), 
     uglify() 
    ] 
} 

のTSconfig-aot.json

{ 
    "compilerOptions": { 
     "target": "es5", 
     "module": "es2015", 
     "moduleResolution": "node", 
     "sourceMap": true, 
     "emitDecoratorMetadata": true, 
     "experimentalDecorators": true, 
     "lib": [ "es2015", "dom" ], 
     "noImplicitAny": true, 
     "suppressImplicitAnyIndexErrors": true, 
     "baseUrl": ".", 
     "paths": { 
      "app/*": [ "../src/*" ] 
     }, 
     "typeRoots": [ 
      "../node_modules/@types" 
     ] 
    }, 
    "files": [ 
     "../src/globals.ts", 
     "../src/Containers/module.aot.ts" 
    ], 
    "exclude": [ 
     "node_modules", 
     "typings" 
    ], 
    "angularCompilerOptions": { 
     "genDir": "../", 
     "skipMetadataEmit": false, 
     "skipTemplateCodegen": false 
    } 
} 

一般的に、AOTはうまく動作しますが、私のコードを1つのファイルにバンドルするためにツリーを動かすことはできません。

この問題を解決してください。

UPD

それはちょうどメインmodule.aot.jsファイルに問題があります。

この問題を解決する方法を教えてください。

答えて

1

私はこの場合の解決策を見つけました。それは非常に簡単ですが、私は、たとえばなど

、この多くの時間、我々は他のサービス、モジュールへの正しいパッチを配置する必要があり、各角度成分で:(

のために費やしていました:

我々は、プロジェクトのこのような構造がある場合:ご希望login.component.tsで、その後

|-main.ts 
|-src 
     | - service 
       | - authorize.service.ts 
     | - login 
       | - login.component.ts 

をするインポートauthorize.service。サービスフォルダからTS、あなたはこのように、このサービスへのパッチを配置する必要があります。

import { donothing } from '../service/authorize.service' 

それは非常に奇妙だが、我々は次のパスを置けばうまく機能JITまたはAOTとの角度アプリこのサービス:

import { donothing } from 'service/authorize.service' 

2番目のケースは、現在のディレクトリにあるいくつかのサービス、モジュールなどへのパスです。例えば

我々は、以前のようなプロジェクトを持っていますが、ルートフォルダに、私たちはhelper.service.tsファイルを持っています。

|-main.ts 
|-helper.service.ts 
... 

あなたはhelper.service.tsこのようなmain.ts含めるしようとした場合:

import { donothing2 } from 'helper.service' 

または

import { donothing2 } from '/helper.service' 

をそれは、と仕事になりますJITおよびAOTただし、動作しません。私たちを実行しようとする雌鶏ロールアップのための木の揺れ

解決策は非常に簡単ですが、私にとっては奇妙です。

ファイル名の前に.を置く必要があります。.が外部インポートとして扱われないためです。

import { donothing2 } from './helper.service' 

私の答えが誰かに役立つことを願います。

ありがとうございました。

関連する問題