Sapui5 app not uglified using grunt

问题

I'm trying to uglify ( mangle + remove comments ) a SapUI5 app by using grunt together with the grunt-sapui5-bestpractice-build plugin.

According to this link, there should not be an uglify task by using this plugin so I've combine it together with the grunt-contrib-uglify plugin.

The problem that I have is; when performing the application build, it seems that my uglify task is being ignored because the grunt-sapui5-bestpractice-build has an implicit uglify task that overwrites the one I'm defining.

For a better understanding, this is the code:

package.json

{
  "name": "grunt-build",
  "version": "0.0.1",
  "description": "Grunt build",
  "private": true,
  "devDependencies": {
      "@sap/grunt-sapui5-bestpractice-build": "1.3.33",
      "grunt-contrib-uglify": "3.3.0"
   }
}

Gruntfile.js

module.exports = function(grunt) {
  'use strict';
    // Project configuration.
    grunt.initConfig({
        uglify: {
            options: {
                mangle: true,
                compress: {
                    drop_console: true,
                    dead_code: false,
                    unused: false
                }
            },
            files: {
                expand: true,
                cwd: "<%= ref.staging%>",
                src: ["**/*.js", '!test/**', '!test_local.html'],
                dest: "<%= ref.process%>"
            }
        }
    }); 

    grunt.loadNpmTasks('@sap/grunt-sapui5-bestpractice-build');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.registerTask('default', [
        'lint',
        'clean',
        'build',
        'uglify'
    ]);
};

The result is that the application is correctly built & minified, Component-preload.js is created ad used to load the app but the mangle is not done and the comments are still there.

Could you kindly provide any advice here? Do you have any way to input the grunt-sapui5-bestpractice-build with the mangle option in order to do it just using one plugin?

Thanks in advance.

回答1:

This is more of an extended comment, and not a fully functional answer. I just ran out of space.

The advantage of having the Component-preload.js not mangled is that you can debug it normally, because it contains the spaces, comments etc. Debugging mangled code is more difficult.

You'll have to look at the things you need to do to accomplish this mangling. After '@sap/grunt-sapui5-bestpractice-build' is done, you have minified but not mangled Component.js, a minified but not mangled Comonponent-preload.js and a normal development version in Component-dbg.js, correct?

You might want to abandon the best practice package and go for something else entirely like this: https://www.npmjs.com/package/grunt-openui5. I can't see what happens in the steps in '@sap/grunt-sapui5-bestpractice-build', I can't even find that package anywhere.

Grunt is only executing a series of tasks in a row. I haven't tried the webIDE versions of this but here's the list of tasks I'm executing as part of an offline openui5 app:

'clean:build', // remove `build` folder
'clean:dist',  // remove `dist` folder
'copy:build',  // copy all my code to the `build` folder
'preload',     // mangle all my code in the `build` folder and create a preload
'copy:dist:minified', // copy the mangled code to `dist`
'copy:dist:dbg',      // copy and rename my original code as `-dbg.js` versions to `dist`
'clean:build' // remove the `build` folder

This was done with gulp, using packages gulp-openui5-preload and gulp-uglify and some others. Not sure if gulp works on the web ide, but I think you can recreate this in Grunt.

You can either use something like this to mangle the results of the default process and create a new preload file, or you can scrap the default and try to roll your own entirely.

来源：https://stackoverflow.com/questions/48811997/sapui5-app-not-uglified-using-grunt

标签

gruntjs

sapui5