"grunt copy" command undoes minification process of "grunt build" command

[Shawful]

Has anyone else noticed this? Found a work around?

Numerous files that have been compressed and shrunk jump to larger sizes after I run the grunt copy command. For example, my *.html file jumps from 7kb to 11kb.

Also, the minification process removes links to multiple style sheets and replaces them with a link to a single *.css style sheet (which is a minified combination of other style sheets). When I run grunt copy, specific files revert to their pre-minification state and suddenly I'm getting 404 errors for the previously mentioned pre-minified *.css files. When I look in the destination copy folder, the single minified, compressed *.css file is present.

Does anyone know of a good work around to this problem? I've been using a regular copy paste for the time being.

[mheesters]

Maybe check the order in which you execute your tasks. Sounds like copy runs before minification. Could you post your gruntfile?

[Shawful]

// Generated on 2014-03-30 using generator-angular 0.8.0
'use strict';

// # Globbing
// for performance reasons we're only matching one level down:
// 'test/spec/{,/}.js'
// use this if you want to recursively match all subfolders:
// 'test/spec/*/.js'

module.exports = function(grunt) {

// Load grunt tasks automatically
require('load-grunt-tasks')(grunt);

// Time how long tasks take. Can help when optimizing build times
require('time-grunt')(grunt);

// Define the configuration for all the tasks
grunt.initConfig({

    // Project settings
    yeoman: {
        // configurable paths
        app: require('./bower.json').appPath || 'app',
        dist: 'dist'
    },

    // Watches files for changes and runs tasks based on the changed files
    watch: {
        bower: {
            files: ['bower.json'],
            tasks: ['bowerInstall']
        },
        js: {
            files: ['<%= yeoman.app %>/scripts/{,*/}*.js'],
            tasks: ['newer:jshint:all'],
            options: {
                livereload: true
            }
        },
        jsTest: {
            files: ['test/spec/{,*/}*.js'],
            tasks: ['newer:jshint:test', 'karma']
        },
        compass: {
            files: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'],
            tasks: ['compass:server', 'autoprefixer']
        },
        gruntfile: {
            files: ['Gruntfile.js']
        },
        livereload: {
            options: {
                livereload: '<%= connect.options.livereload %>'
            },
            files: [
                '<%= yeoman.app %>/{,*/}*.html',
                '.tmp/styles/{,*/}*.css',
                '<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
            ]
        }
    },

    // The actual grunt server settings
    connect: {
        options: {
            port: 9000,
            // Change this to '0.0.0.0' to access the server from outside.
            hostname: 'localhost',
            livereload: 35729
        },
        livereload: {
            options: {
                open: true,
                base: [
                    '.tmp',
                    '<%= yeoman.app %>'
                ]
            }
        },
        test: {
            options: {
                port: 9001,
                base: [
                    '.tmp',
                    'test',
                    '<%= yeoman.app %>'
                ]
            }
        },
        dist: {
            options: {
                base: '<%= yeoman.dist %>'
            }
        }
    },

    // Make sure code styles are up to par and there are no obvious mistakes
    jshint: {
        options: {
            jshintrc: '.jshintrc',
            reporter: require('jshint-stylish')
        },
        all: [
            'Gruntfile.js',
            '<%= yeoman.app %>/scripts/{,*/}*.js'
        ],
        test: {
            options: {
                jshintrc: 'test/.jshintrc'
            },
            src: ['test/spec/{,*/}*.js']
        }
    },

    // Empties folders to start fresh
    clean: {
        dist: {
            files: [{
                dot: true,
                src: [
                    '.tmp',
                    '<%= yeoman.dist %>/*',
                    '!<%= yeoman.dist %>/.git*'
                ]
            }]
        },
        server: '.tmp'
    },

    // Add vendor prefixed styles
    autoprefixer: {
        options: {
            browsers: ['last 1 version']
        },
        dist: {
            files: [{
                expand: true,
                cwd: '.tmp/styles/',
                src: '{,*/}*.css',
                dest: '.tmp/styles/'
            }]
        }
    },

    // Automatically inject Bower components into the app
    bowerInstall: {
        app: {
            src: ['<%= yeoman.app %>/index.html'],
            ignorePath: '<%= yeoman.app %>/'
        },
        sass: {
            src: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'],
            ignorePath: '<%= yeoman.app %>/bower_components/'
        }
    },

    // Compiles Sass to CSS and generates necessary files if requested
    compass: {
        options: {
            sassDir: '<%= yeoman.app %>/styles',
            cssDir: '.tmp/styles',
            generatedImagesDir: '.tmp/images/generated',
            imagesDir: '<%= yeoman.app %>/images',
            javascriptsDir: '<%= yeoman.app %>/scripts',
            fontsDir: '<%= yeoman.app %>/styles/fonts',
            importPath: '<%= yeoman.app %>/bower_components',
            httpImagesPath: '/images',
            httpGeneratedImagesPath: '/images/generated',
            httpFontsPath: '/styles/fonts',
            relativeAssets: false,
            assetCacheBuster: false,
            raw: 'Sass::Script::Number.precision = 10\n'
        },
        dist: {
            options: {
                generatedImagesDir: '<%= yeoman.dist %>/images/generated'
            }
        },
        server: {
            options: {
                debugInfo: true
            }
        }
    },

    // Renames files for browser caching purposes
    rev: {
        dist: {
            files: {
                src: [
                    '<%= yeoman.dist %>/scripts/{,*/}*.js',
                    //'<%= yeoman.dist %>/styles/{,*/}*.css',
                    //'<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}',
                    '<%= yeoman.dist %>/styles/fonts/*'
                ]
            }
        }
    },

    // Reads HTML for usemin blocks to enable smart builds that automatically
    // concat, minify and revision files. Creates configurations in memory so
    // additional tasks can operate on them
    useminPrepare: {
        html: '<%= yeoman.app %>/index.html',
        options: {
            dest: '<%= yeoman.dist %>',
            flow: {
                html: {
                    steps: {
                        js: ['concat', 'uglifyjs'],
                        css: ['cssmin']
                    },
                    post: {}
                }
            }
        }
    },

    // Performs rewrites based on rev and the useminPrepare configuration
    usemin: {
        html: ['<%= yeoman.dist %>/{,*/}*.html'],
        //css: ['<%= yeoman.dist %>/styles/{,*/}*.css'],
        options: {
            assetsDirs: ['<%= yeoman.dist %>']
        }
    },

    // The following *-min tasks produce minified files in the dist folder
    cssmin: {
        options: {
            root: '<%= yeoman.app %>'
        }
    },

    imagemin: {
        dist: {
            files: [{
                expand: true,
                cwd: '<%= yeoman.app %>/images',
                src: '{,*/}*.{png,jpg,jpeg,gif}',
                dest: '<%= yeoman.dist %>/images'
            }]
        }
    },

    svgmin: {
        dist: {
            files: [{
                expand: true,
                cwd: '<%= yeoman.app %>/images',
                src: '{,*/}*.svg',
                dest: '<%= yeoman.dist %>/images'
            }]
        }
    },

    htmlmin: {
        dist: {
            options: {
                collapseWhitespace: true,
                collapseBooleanAttributes: true,
                removeCommentsFromCDATA: true,
                removeOptionalTags: true
            },
            files: [{
                expand: true,
                cwd: '<%= yeoman.dist %>',
                src: ['views/{,*/}*.html'],
                dest: '<%= yeoman.dist %>'
            }]
        }
    },

    // ngmin tries to make the code safe for minification automatically by
    // using the Angular long form for dependency injection. It doesn't work on
    // things like resolve or inject so those have to be done manually.
    ngmin: {
        dist: {
            files: [{
                expand: true,
                cwd: '.tmp/concat/scripts',
                src: '*.js',
                dest: '.tmp/concat/scripts'
            }]
        }
    },

    // Replace Google CDN references
    cdnify: {
        dist: {
            html: ['<%= yeoman.dist %>/*.html']
        }
    },

    // Copies remaining files to places other tasks can use
    copy: {
        dist: {
            files: [{
                compress: true,
                dot: true,
                cwd: '<%= yeoman.app %>',
                dest: '<%= yeoman.dist %>',
                src: [
                    '*.{ico,png,txt}',
                    '.htaccess',
                    '*.html',
                    'views/{,*/}*.html',
                    'bower_components/**/*',
                    'images/{,*/}*.{webp}',
                    'fonts/*',
                    'json/*',
                    'scripts/**/*',
                    'styles/**/{,*/}*.{css}'
                ]
            }, {
                compress: true,
                cwd: '.tmp/images',
                dest: '<%= yeoman.dist %>/images',
                src: ['generated/*']
            }, {
                compress: true,
                cwd: '<%= yeoman.app %>/styles',
                dest: '.tmp/styles/',
                src: '{,*/}*.css'
            }, {
                compress: true,
                flatten: true,
                cwd: '<%= yeoman.app %>',
                dest: '<%= yeoman.dist %>/fonts',
                src: ['bower_components/sass-bootstrap/fonts/*.*']
            }]
        },
        public: {
            compress: true,
            cwd: '<%= yeoman.dist %>',
            dest: '../enchilada/api/public_html/public',
            src: [
                '*.{ico,png,txt}',
                '.htaccess',
                '*.html',
                'views/{,*/}*.html',
                'bower_components/**/*',
                'images/**',
                'fonts/*',
                'scripts/**/*',
                'styles/**'
            ]
        }
    },

    // Run some tasks in parallel to speed up the build process
    concurrent: {
        server: [
            'compass:server'
        ],
        test: [
            'compass'
        ],
        dist: [
            'compass:dist',
            'imagemin',
            'svgmin'
        ]
    },

    // By default, your `index.html`'s <!-- Usemin block --> will take care of
    // minification. These next options are pre-configured if you do not wish
    // to use the Usemin blocks.
    // cssmin: {
    //   dist: {
    //     files: {
    //       '<%= yeoman.dist %>/styles/main.css': [
    //         '.tmp/styles/{,*/}*.css',
    //         '<%= yeoman.app %>/styles/{,*/}*.css'
    //       ]
    //     }
    //   }
    // },
    // uglify: {
    //   dist: {
    //     files: {
    //       '<%= yeoman.dist %>/scripts/scripts.js': [
    //         '<%= yeoman.dist %>/scripts/scripts.js'
    //       ]
    //     }
    //   }
    // },
    // concat: {
    //   dist: {}
    // },

    // Test settings
    karma: {
        unit: {
            configFile: 'karma.conf.js',
            singleRun: true
        }
    }
});


grunt.registerTask('serve', function(target) {
    if (target === 'dist') {
        return grunt.task.run(['build', 'connect:dist:keepalive']);
    }

    grunt.task.run([
        'clean:server',
        'bowerInstall',
        'concurrent:server',
        'autoprefixer',
        'connect:livereload',
        'watch'
    ]);
});

grunt.registerTask('server', function(target) {
    grunt.log.warn('The `server` task has been deprecated. Use `grunt serve` to start a server.');
    grunt.task.run(['serve:' + target]);
});

grunt.registerTask('test', [
    'clean:server',
    'concurrent:test',
    'autoprefixer',
    'connect:test',
    'karma'
]);

grunt.registerTask('build', [
    'clean:dist',
    'bowerInstall',
    'useminPrepare',
    'concurrent:dist',
    'autoprefixer',
    'concat',
    'ngmin',
    'copy:dist',
    'cdnify',
    'cssmin',
    'uglify',
    'rev',
    'usemin',
    'htmlmin'
]);

grunt.registerTask('default', [
    'newer:jshint',
    'test',
    'build'
]);

};

[Shawful]

I have moved the 'copy:dist' task to the bottom of the task list for "grunt build", just below "htmlmin", but that does not resolve the problem.

[mheesters]

Looks like the copy actions overwrite the already minified files with the original files.
If you check out htmlmin and copy for example:

htmlmin: src: ['views/{,/}.html'] ---> dest: '<%= yeoman.dist %>'
copy: src: [.... 'views/{,/}.html',.... dest: '<%= yeoman.dist %> --->

I'd suggest you perform copy as soon as possible. It will copy all files to the yeoman.dist directory.
After that use all the minify actions/magic on the files by setting the src directory to yeoman.dist, and not the original files.

Of course you could also work the other way around, and let all the magic happen with your result in yeoman.dist. And after that use copy to copy the files in the yeoman.dist to the folder of your pleasing.

[mheesters]

Please mind the ''clean:dist'' action which removes all the files in yeoman.dist

[Shawful]

Okay, I've moved the copy action to be second in the list. First the dist folder must be cleaned (using the 'clean:dist' action). Everything is copied fine. I even added another task called 'copy:public', which copies my dist folder to a separate folder for my server's consumption, and I queued this task to occur last.

Now that the files aren't being resized I'm happy. On to getting the missing background image to show. The background is defined in my CSS, so I think either the minification or sass precompiler may be the culprit. Everything loads fine on my dev machine, but who knows.

Thanks for the help.

[mheesters]

Glad i could help!

Regarding finding the missing bg. Maybe execute every task one-at-a-time and look when it goes wrong.