[SOLVED] Configuring app scripts for uglification and minification

Ionic Framework ionic-v3
1

I want to further remove comments from the js files and minify or compress the css in my app. I have tried configuring the app-scripts as outlined in the tutorial here: https://ionicframework.com/docs/resources/app-scripts/ but the resultant code is not as per the rules I define.

Here is my package.json file’s config object:

"config": {
        "ionic_uglifyjs": "./config/uglifyjs.config.js",
        "ionic_cleancss": "./config/cleancss.config.js"
    },

And here are the config files in node_modules/@ionic/app-scripts/config/ folder:

cleancss.config.js:


// https://www.npmjs.com/package/clean-css

module.exports = {
  /**
   * sourceFileName: the file name of the src css file
   */
  sourceFileName: process.env.IONIC_OUTPUT_CSS_FILE_NAME,

  /**
   * destFileName: the file name for the generated minified file
   */
  destFileName: process.env.IONIC_OUTPUT_CSS_FILE_NAME,

  level: {
    1: {
    removeEmpty: true,
    specialComments: 'all'
    }
  }
};

uglify.config.js


// https://www.npmjs.com/package/uglify-js

module.exports = {

  /**
   * mangle: uglify 2's mangle option
   */
  mangle: true,

  /**
   * compress: uglify 2's compress option
   */
  compress: {
    unused: true,
    dead_code: true,
    toplevel: true,
    drop_console:true
  },

  /**
   * comments: uglify 2's comments option
   */
  comments: false
};

Can anybody help? Thanks.

1 Like
2

Not sure what you want, but if minifying CSS and JS, I use these command

  • For Android: ionic build android --prod
  • For IOS: ionic build ios --prod
  • For web application: ionic build browser --prod
    Note: Please ensure correct platforms are added before.
3

I used the following comment: Remove console logs (release)

and second, I did not know about the --prod flag. thanks for that.

A combination worked perfectly.

4

combination --prod and --release did the thing for me:
npm run ionic:build --prod --release

2 Likes