@gpeel/my-angular-logger v2.4.5

my-angular-logger is built with 4 main requirements:

• easy removal or restriction of log output in production mode
• 'clickable' logs in console. The logs are not referenced from the log service but still show your code origin.
• intuitive log4J-like hierachy : DEBUG, INFO, WARN, ERROR and NONE, also Additivity.
• an extra independant logging axis for PERF logs : creation of instances, ChangeDetection counting and Component DOM-refresh counting can be logged using this axis.
  2 Angular Components RefreshCountComponent and RootRefreshCountComponent are provided to help you.

The icing on the cake features :

• colorful configurable logs !

• static colorful logs for easy debug (those logs should be removed in order not to log if in --prod ) . It replaces the console.log() and do not need to create a MyLogger instance.

  MyLogger.pink('Pink debug static logs! easily set, easily removed');

• a killswitch for PERF logs to change logging without recompiling for all RefreshCountComponent and RootRefreshCountComponent. So PERF could be switch ON anytime without changing the configuration. Also a @Component PerfKillSwitchComponent to include in your app to control this switch (see demo). This PERF killswitch also works in PROD mode and so it could be very useful to activate momentaringly the PERF log without deploying the app again.

A full demo and more complete documentation available on github at https://github.com/gpeel/my-angular-logger-demo

1- Setup

npm install @gpeel/my-angular-logger

2- (Required) Define the log level you want in your root module

     MyLoggerModule.forRoot( [MyLevel.WARN, MyExtra.PERF_ON] ),  

This activates the MyLoggerModule and set a logging level of WARN at the Root with also the PERF logs activated. If you do not want logs at the root Level (implicit default is MyLevel.NONE) use : MyLoggerModule.forRoot();

3- (Optional) Override/extend/change the log level in LAZY module

LAZY module will inherit from the above defintion, and can change it with forChild() method:

     MyLoggerModule.forChild([MyLevel.INFO]),  

4- (Optional) Override/extend/change the log level in your Components

Components inherit from the above defintion, and can change it with forProvider() method:

     MyLoggerModule.forProvider([MyLevel.DEBUG]),  

5- Use the MyLoggerState injection to create a local logger

    export class NavSubComponent   {  
      
      logger: MyLogger;  
      
      constructor(loggerState: MyLoggerState) {  
        // defining your local logger
        this.logger = loggerState.createLogger('NavSubComponent');
        
        // using your logger  
        this.logger.perf('CREATED');  // here is line 27
        this.logger.info('this is a log of Level INFO'); // here is line 28  
      }  
      
    }  

The output in the console will be :

6-Prod mode override

In environment.prod.ts define 'LOGGER_CONFIG_PROD' containing your logger configuration for the whole application, for example the following conf would lock to WARN and ERROR : (Note : you can explicitely play with the LOCK/UNLOCK flags in prod mode to still enable some logging in your app)

    export const environment = {
      production: true,
      'LOGGER_CONFIG_PROD': [MyLevel.WARN, MyExtra.LOCKED]
    };

Use the aboce config in your Root AppModule:

     MyLoggerModule.forRoot( [MyLevel.WARN, MyExtra.PERF_ON],
                              environment['LOGGER_CONFIG_PROD']  ),