Ошибка Angular 6 при импорте функционального модуля - вызовы функций не поддерживаются в декораторах

Question

Я новичок в Angular 6, раньше работал в AngularJS 1.x. В настоящее время я пытаюсь импортировать пользовательский модуль в мое основное приложение, и у меня возникла ошибка, которая, по моему мнению, вызывает недопонимание. Я видел пару других SO-сообщений, созданных для этого, и я думаю, что это какая-то проблема с компиляцией AOT в Angular, но я не уверен, как это исправить.

По сути, у меня есть два модуля в одной "корневой" директории. Один из этих модулей - www - мое основное приложение. Другой - сервисы - это пользовательское приложение для обработки данных сервисов. Я делаю это таким образом, чтобы я мог разделить модуль "сервисы" между www и другими будущими приложениями / модулями.

Структура приложения

|- www/
|-- app/
|--- src/
|---- app.module.ts
|- services/
|-- app/
|--- src/
|---- services.module.ts

Модуль Www

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

import { WwwComponent } from './www.component';
import { ServicesModule | from './../../../services/app/src/services.module.ts';

@NgModule({
  declarations: [
    WwwComponent
  ],
  imports: [
    BrowserModule,
    ServicesModule
  ],
  providers: [],
  bootstrap: [WwwComponent]
})
export class WwwModule { }

Сервисный модуль

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, ModuleWithProviders } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { RouterModule } from '@angular/router';

import { ServicesComponent } from './services.component';

import { AuthService } from '../auth.service';
import { HttpService } from '../http.service';
import { TemplateService } from '../template/template.service';
import { ModalService } from '../modal/modal.service';

@NgModule({
    declarations: [
        ServicesComponent
    ],
    exports: [
        ServicesComponent
    ],
    imports: [
        BrowserModule,
        RouterModule,
        HttpClientModule
    ],
    providers: [
        AuthService,
        HttpService,
        TemplateService,
        ModalService
    ],
    bootstrap: [ServicesComponent]
})
export class ServicesModule {}

Ошибки, которые я получаю при запуске ng build:

1. Ошибка во время компиляции шаблона WwwModule
2. Вызовы функций не поддерживаются в декораторах, но был вызван "ServicesModule".
3. Невозможно повторно объявить блочную переменную ngDevMode.

Кто-нибудь видит, что я делаю неправильно, чтобы включить другой Angular Module в мое приложение Angular?

Спасибо!

Answer 1

Как оказалось, это проблема с модулями и файловой структурой для использования общих / пользовательских модулей. По сути, проблема заключалась в том, что я укоренял два отдельных модуля ngModule в одной корневой директории, каждый со своими /node_modules/ зависимости. Основным решением является группировка двух NgModules в одном родительском каталоге, чтобы они могли "делиться" зависимостями node_modules.

Поскольку я использую SVN и не хочу извлекать общий модуль в каталоге project/app, я скопировал src / из модуля Services в папку www / app / src / и включил оттуда модуль services,

Изменена структура папок

|- www/
|-- app/
|--- src/
|---- app.module.ts
|--- services/
|---- app/
|----- services.module.ts

Изменения в Www AppModule *

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

import { WwwComponent } from './www.component';
import { ServicesModule | from './../services/app/src/services.module.ts';

@NgModule({
  declarations: [
    WwwComponent
  ],
  imports: [
    BrowserModule,
    ServicesModule
  ],
  providers: [],
  bootstrap: [WwwComponent]
})
export class WwwModule { }

Для справки, эти ссылки помогли мне указать правильное направление:

1. https://groups.google.com/forum/
2. AOT Компиляция и ссылки на модули

Надеюсь, это поможет кому-то еще!