错误尝试做一个混合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应用程序

回答

相关问题