錯誤嘗試做一個混合AngularJS/Angular應用程序

我試圖做一個混合應用程序使用AngularJS & Angular（2）。我已經有一個大的AngularJS應用程序，我只想使用Angular應用程序中的組件。錯誤嘗試做一個混合AngularJS/Angular應用程序

使用https://angular.io/docs/ts/latest/guide/upgrade.html，我已經創建了兩個新文件

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

難道有人知道爲什麼嗎？

這裏是tsconfig.json，也許它可以幫助

{ 
    "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

來源

2017-03-06 BkSouX

你的文件夾結構是什麼樣的？ – kevingreen

是的。我有一個獨立的Angular應用程序，我想在另一個項目AngularJS應用程序中包含owl應用程序。這兩個應用程序已經很大，所以我無法轉換一個應用程序。 – BkSouX

我已添加文件夾結構 – BkSouX

好吧，我不知道爲什麼進口沒有工作，但是當我在設置應有盡有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應用程序作爲節點包導入到我的項目中，但我想我必須對導出做一些改進。

我想導入根組件，我還必須導入根模塊嗎？

來源

2017-03-08 08:40:33 BkSouX

錯誤嘗試做一個混合AngularJS/Angular應用程序

回答

相關問題