question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Add documentation to include angular2-logger in an angular-cli project

See original GitHub issue

The current README.md explain how to add angular2-logger to the quickstart project but if one is using angular-cli this is not the way to do it (for example there is no system.config.js).

Adding third party libs are explain in angular-cli readme but there is a few more thing to set it up 😃

Here how I did it on my project (after running ng new myproject):

  • Install the npm module

npm install --save angular2-logger

  • Configure the logger

For dev in environment.ts

import { Level } from 'angular2-logger/core';
export const environment = {
  production: false,
  logger: {
    level: Level.INFO
  }
};

For prod in environment.prod.ts

import { Level } from 'angular2-logger/core';
export const environment = {
  production: true,
  logger: {
    level: Level.WARN
  }
};

  • Load configuration in app.module.ts
/* tslint:disable:no-console */
import { Logger } from 'angular2-logger/core';
import { NgModule, isDevMode } from '@angular/core';
import { environment }    from '../environments/environment';
...
@NgModule({
  declarations: [ ... ],
  imports: [ ...  ],
  providers: [ Logger ],
  bootstrap: [ ... ]
})
export class AppModule {
  constructor(private logger: Logger) {
    if (isDevMode()) {
      console.info('To see debug logs enter: \'logger.level = logger.Level.DEBUG;\' in your browser console');
    }
    this.logger.level = environment.logger.level;
  }
}

  • Usage

For example in app.component.ts:

export class AppComponent implements OnInit {
  constructor(private logger: Logger) {
  public ngOnInit() {
    this.logger.debug('ngOnInit');
  }
}

angular-cli: 1.0.0-beta.18

Issue Analytics

  • State:open
  • Created 7 years ago
  • Reactions:10
  • Comments:10 (4 by maintainers)

github_iconTop GitHub Comments

3reactions
jmfullertoncommented, Dec 13, 2017

With Angular-CLI version 1.5.0 I’m getting the following error.

ERROR in ./node_modules/angular2-logger/app/core/level.ts Module build failed: Error: M:\Git\dev\loggerTest\node_modules\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.

1reaction
dwoznickacommented, Jun 6, 2017

Seems like a good time to update the documentation on this matter, as cli is out of beta for a while now 😉

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to add angular2-logger to my Angular4 project?
CLI handles everything. You really shouldn't even need to configure,so just try npm install --save angular2-logger then Setup the Provider ...
Read more >
angular2-logger
Start using angular2-logger in your project by running `npm i angular2-logger`. ... A simpler Log4j inspired logger module for Angular 2.
Read more >
ng build
Option Description Value Type Default Value ‑‑aot Build using Ahead of Time compilation. boolean true ‑‑base‑href Base url for the application being built. string ‑‑delete‑output‑path Delete...
Read more >
Building and serving Angular apps
A project's src/environments/ folder contains the base configuration file, environment.ts , which provides a default environment. You can add override ...
Read more >
ng new
Option Description Value Type Default Value ‑‑commit Initial git repository commit information. boolean true ‑‑directory The directory name to create the workspace in. string ‑‑force Force...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found