Error in Angular 5 projects which use angular2-logger

Viewed 1675

I'm using angular2-logger version 0.6.0 in an Angular CLI project. When I try to upgrade to Angular CLI 1.5 and Angular 5, the following error occurs

ERROR in ./node_modules/angular2-logger/app/core/level.ts
Module build failed: Error: C:\test\sample-5\sample\node_module\angular2-logger\app\core\level.ts is not part of the compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.

at AngularCompilerPlugin.getCompiledFile (C:\test\sample-5\sample\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:624:23)
at plugin.done.then (C:\test\sample-5\sample\node_modules\@ngtools\webpack\src\loader.js:467:39)
at <anonymous>
@ ./node_modules/angular2-logger/core.js 6:9-36
@ ./src/app/app.module.ts
@ ./src/main.ts
@ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts

This is app.module.ts

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

import { AppComponent } from './app.component';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [Logger],
  bootstrap: [AppComponent]
})
export class AppModule { }

This sample project is created by ng new sample, so every settings are Angular CLI default.

3 Answers

From the linked angular2-logger issue:

As the error states, you need to include a reference to the Typescript files that are imported by angular2-logger so TypeScript is aware of them. Edit the tsconfig.json (or tsconfig.app.json if you're using the angular cli) to include the following snippet:

"include": [
    "../node_modules/angular2-logger/app/core/level.ts",
    "../node_modules/angular2-logger/app/core/logger.ts",
    "../node_modules/angular2-logger/app/core/providers.ts",
    "**/*.ts"
],

*The paths may change depending on your node_modules and tsconfig.json location. I had to use like this:

"node_modules/angular2-logger/app/core/level.ts",

Since i am not a wildcard fan, i removed the last line "**/*.ts" and got erros about the files, which are located directly under src. So i ended up listing those also on the list. This is the result, which worked for me:

  "include": [
    "node_modules/angular2-logger/app/core/level.ts",
    "node_modules/angular2-logger/app/core/logger.ts",
    "node_modules/angular2-logger/app/core/providers.ts",
    "src/main.ts",
    "src/polyfills.ts"
  ]
Related