Angular 角度共享包：意外值'&书信电报；模块名称>'；由模块导入'；AppModule'；。请添加@NgModule注释

我正在开发一个新的Angular（基于cli）应用程序。考虑到未来的项目，我正试图将常见的特定于域的服务拆分为一个共享包

NgModule

，再拆分为一个与我的主应用程序对等的文件系统应用程序，如下所示：

./my-company
    /main-app
    /shared
        /src/app/services
            index.js
            package.json
            shared-services.module.ts
            shared-test-service.ts

当我

npm service

main应用程序时，我收到错误消息：

Uncaught错误：模块“AppModule”导入了意外值“SharedServicesModule”。请添加@NgModule注释。

我知道npm链接存在的问题，所以请尽我所能，根据故事进行设置。（作为私有NPM模块托管共享包是一种可能性，但我被要求首先调查其他选项。）

我在SO和Gitub上看到了许多关于这个问题的问题，并尝试了各种建议的解决方案。我猜我错过了一些小细节，但我对所有运动部件的理解还不够透彻，无法说出它是什么。请多看几眼

以下是我得到的：

共享模块 package.json

{
    "name": "tt-shared-services-module",
    "version": "1.0.0",
    "description": "Description...",
    "main": "index.js",
    "scripts": { /* ... */ },
    "author": "Fnord",
    "license": "MIT",
    // per recommendation from 'Linked libraries' story
    "devDependencies": {
        "@angular/core": "4.3.5"
    },
    "peerDependencies": {
        "@angular/core": "4.3.5"
    }
}

{
    "extends": "../tsconfig.json",
    "compilerOptions": {
        "outDir": "../out-tsc/app",
        "baseUrl": "./",
        "module": "es2015",
        "types": [],
        // per recommendation from 'Linked libraries' story
        "paths": {
            "@angular/*": [
                "node_modules/@angular/*"
            ]
        }
    },
    "exclude": [
        "test.ts",
        "**/*.spec.ts"
    ]
}

共享服务.module.ts

import { NgModule } from '@angular/core';
import { SharedTestService } from './shared-test.service';

@NgModule({
    providers: [SharedTestService]
})
export class SharedServicesModule {}

import { HttpClientModule } from '@angular/common/http';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';
import { SharedServicesModule } from 'tt-shared-services-module';

import { AppComponent } from './app.component';
// ... app-specific components / services

@NgModule({
    declarations: [
        AppComponent,
        // ... app-specific components 
    ],
    imports: [
        BrowserModule,
        HttpClientModule,
        FormsModule,
        SharedServicesModule
    ],
    bootstrap: [AppComponent]
})

export class AppModule { }

共享测试服务.ts

import { Injectable } from '@angular/core';

@Injectable()
export class SharedTestService {
    constructor() { }
    message = 'Greetings from SharedTestService!';
}

index.js

export * from './shared-services.module';

主应用程序 应用程序模块.ts

import { NgModule } from '@angular/core';
import { SharedTestService } from './shared-test.service';

@NgModule({
    providers: [SharedTestService]
})
export class SharedServicesModule {}

import { HttpClientModule } from '@angular/common/http';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';
import { SharedServicesModule } from 'tt-shared-services-module';

import { AppComponent } from './app.component';
// ... app-specific components / services

@NgModule({
    declarations: [
        AppComponent,
        // ... app-specific components 
    ],
    imports: [
        BrowserModule,
        HttpClientModule,
        FormsModule,
        SharedServicesModule
    ],
    bootstrap: [AppComponent]
})

export class AppModule { }

tsconfig.app.json

{
    "name": "tt-shared-services-module",
    "version": "1.0.0",
    "description": "Description...",
    "main": "index.js",
    "scripts": { /* ... */ },
    "author": "Fnord",
    "license": "MIT",
    // per recommendation from 'Linked libraries' story
    "devDependencies": {
        "@angular/core": "4.3.5"
    },
    "peerDependencies": {
        "@angular/core": "4.3.5"
    }
}

{
    "extends": "../tsconfig.json",
    "compilerOptions": {
        "outDir": "../out-tsc/app",
        "baseUrl": "./",
        "module": "es2015",
        "types": [],
        // per recommendation from 'Linked libraries' story
        "paths": {
            "@angular/*": [
                "node_modules/@angular/*"
            ]
        }
    },
    "exclude": [
        "test.ts",
        "**/*.spec.ts"
    ]
}

---

非常感谢fours提供的任何帮助、指示和线索

SharedTestService

是一项服务，为什么你需要为此创建一个模块，只需将其放入app.module

providers

@RahulSingh：我将引用我的第一段话：“为了预期未来的项目，我正试图将常见的领域特定服务拆分为一个共享包…”我的目的是将这些服务实现为抽象类，这样只有真正的通用功能才会存在，而消费应用程序将提供具体的实现。@RahulSingh，告诉我一些我已经知道的事情-这与我的清晰和详细的问题毫无关系-毫无帮助。在一个规则中没有所谓的真正模块，一切都可以归结为应用程序模块。当你编译时，你可以在应用程序模块中将此服务分开，并为不同的任务创建其他服务。这完全是错误的。反复告诉我“只需将其放入app.module”会让我相信你不理解我试图解决的问题。