ハイブリッドAngularJS/Angularアプリケーションを実行しようとしたときにエラーが発生しました

Question

AngularJSを使用してハイブリッドアプリケーションを実行しようとしています&角度（2）。 私はすでに大きなAngularJSアプリを持っており、Angularアプリのコンポーネントを使いたいだけです。 https://angular.io/docs/ts/latest/guide/upgrade.htmlを使用して

は、私は2つの新しいファイル

app.module.ts

import { UpgradeModule } from '@angular/upgrade/static'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 

@NgModule({ 
    imports: [ 
    BrowserModule, 
    UpgradeModule, 
    ], 
}) 
export class AppModule { 
    ngDoBootstrap() {} 
} 

とmain.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 
import { UpgradeModule } from '@angular/upgrade/static'; 
import { AppModule } from './app.module'; 
import App from './app.js'; 

platformBrowserDynamic().bootstrapModule(AppModule).then(platformRef => { 
    const upgrade = platformRef.injector.get(UpgradeModule) as UpgradeModule; 
    upgrade.bootstrap(document.documentElement, [App]); 
}); 

を作成していると私は古いbootstrap.jsファイルを削除しました

import angular from 'angular'; 
import App from './app'; 

angular.element(function() { 
    angular.bootstrap(document, [App], { strictDi: true }); 
}); 

私のwebpackビルドのエントリーは今やmain.tsです。

私は私のアプリを起動すると、私はANAの問題を持っている：

ERROR in ./client/app/main.ts 
Module not found: Error: Can't resolve './app.module' in '/home/bsousa/Projects/S6/client/app' 
@ ./client/app/main.ts 5:21-44 

誰かが理由を知っていますか？ここで

は、多分それは

{ 
    "compilerOptions": { 
    "target": "es6", 
    "module": "commonjs", 
    "allowJs": true, 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": false, 
    "noImplicitAny": false, 
    "allowUnreachableCode": true 
    }, 
    "exclude": [ 
    "node_modules" 
    ] 
} 

ファイル構造に

/ 
    client 
     app 
     ... 
     app.js 
     app.module.ts 
     main.ts 
    gulpfile.js 
    webpack.config.js 

Answer 1

を助けることができるまあ、インポートが機能しなかった理由を私は知らないが、私はすべてを設定すると、tsconfig.jsonですmain.tsファイル、それは動作します

import 'zone.js'; 
import 'angular'; 
import App from './app.js'; 
import { NgModule } from '@angular/core'; 
import { UpgradeModule } from '@angular/upgrade/static'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 

@NgModule({ 
    imports: [ 
    BrowserModule, 
    UpgradeModule, 
    ], 
}) 
export class AppModule { 
    ngDoBootstrap() { 
    } 
} 

platformBrowserDynamic().bootstrapModule(AppModule).then(platformRef => { 
    const upgrade = platformRef.injector.get(UpgradeModule) as UpgradeModule; 
    upgrade.bootstrap(document.documentElement, [App.name], { strictDi: true }); 
}); 

私のAngularJSはAngularでブートストラップされています。

私はノードパッケージとして自分のプロジェクトに角型アプリケーションをインポートしようとしていますが、エクスポートでいくつかの改善が必要だと思います。

ルートコンポーネントをインポートしたいと思いますが、ルートモジュールもインポートする必要がありますか？