Remove console logs (release)

How do I get rid of console logs from an ionic 2 release application?

I am developing an ionic 2 app. When I build the signed release apk for Android and run on a device, I can still attach to the process from chrome://inspect, and view console logs.

I have tried removing the cordova-plugin-console, but that makes no difference.

On a related issue, I am also able to view decoded HTTPS traffic using chrome://inspect.

Edit: I found this package which claims to do what I want. How can I go about including it into my ionic build process when building release version?

Thanks.

2 Likes

For the most part, you shouldn’t really have to worry about this.
Since production ios and android builds removed debugging capabilities, no will be able to see these/access them.

Hi Mike, I am currently testing with Genymotion and can see console logs and private HTTPS traffic if I attach to the release APK with chrome://inspect.

I also tried creating a new project to test and can reproduce with the following steps:

ionic start -v2 testblank blank
ionic plugin remove cordova-plugin-console
ionic build android --release --prod -- --keystore="..." --alias=...
install on Genymotion and inspect with Chrome
$ ionic info
******************************************************
 Dependency warning - for the CLI to run correctly,
 it is highly recommended to install/upgrade the following:

 Please install your Cordova CLI to version  >=4.2.0 `npm install -g cordova`

******************************************************

Your system information:

 You have been opted out of telemetry. To change this, run: cordova telemetry on.
6.4.0

Ionic Framework Version: 2.0.0-rc.5
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.0.0
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 8.1
Node Version: v6.9.2
Xcode version: Not installed


******************************************************
 Dependency warning - for the CLI to run correctly,
 it is highly recommended to install/upgrade the following:

 Please install your Cordova CLI to version  >=4.2.0 `npm install -g cordova`

******************************************************

Thanks,
Mike.

As you stated production Android builds removed the debugging capabilities. However when I follow the instructions here Ionic Publishing for cordova plugin rm cordova-plugin-console --save (since I have it in my config.xml) and then make a production release using ionic build android --release --prod the app crashes on startup. I zip aligned and signed the production Android release properly. If I follow the same exact steps omitting cordova plugin rm cordova-plugin-console --save the app works as expected and the console logs are not seen. I’m not sure if this is a bug or this is a required plugin in which this should be noted someplace.

Here’s my ionic info:

******************************************************

Your system information:

Cordova CLI: 6.5.0 
Ionic Framework Version: 2.0.1
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.0.1
ios-deploy version: Not installed
ios-sim version: Not installed
OS: macOS Sierra
Node Version: v7.1.0
Xcode version: Xcode 8.2.1 Build version 8C1002



******************************************************

You can use uglifyjs.config.js for drop all console logs.

  1. Copy uglifyjs.config.js from node_modules into your project folder
  2. In the new config file set the flag drop_console to true
  compress: {
    drop_console: true
  },

3 . Set your custom configuration in the package.json

"config": {
    "ionic_uglifyjs": "uglifyjs.config.js"
  },

And that’s all !

4 Likes

Where’d you find this? Is there more? :open_mouth:

reading docs :wink:

uglifyjs compress options: https://github.com/mishoo/UglifyJS2#compressor-options
ionic-app-scripts custom config: https://github.com/driftyco/ionic-app-scripts#custom-configuration

2 Likes

I do it like this:

app/config/uglifyjs.config.js

let defaultConfig = require('@ionic/app-scripts/config/uglifyjs.config');

module.exports = Object.assign({}, defaultConfig, {
	compress: Object.assign({}, defaultConfig.compress, {
		drop_console: true,
		drop_debugger: true
	})
});

app/package.json

{
...
    "config": {
        "ionic_uglifyjs": "./config/uglifyjs.config.js"
    },
...
}
7 Likes

But what about PWAs? This still seems to be an issue there

2 Likes

I tried the uglify trick, but logs are still there.I tried several different things, but I can’t get rid of logs in release apk no matter what.

Did anybody managed to make it work?

Can I do something similar with an older Ionic v1 app?

For someone looking for a quick solution, just add this to src/app/main.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';

// disable console log
 console.log = function(){};

platformBrowserDynamic().bootstrapModule(AppModule);
6 Likes

The solution suggested by @guillefd will hide the printouts to console, but performance win will be lesser then when removing calls to console.log()

Is this still true with Capacitor / Ionic4 ?

1 Like