grunt-contrib-copy - Copy HTML file from ROOT to DIST folder with different assets path

317 Views Asked by At

I am trying to copy HTML file from ROOT folder to DIST folder and that HTML will be minified. I've already achieved that so far.

Now, when the HTML files is being copied to DIST folder, I want to change the INCLUDE path within all included CSS and SCRIPTS.

Is it possible. I went through lot of search on tech forums and so but couldn't find anywhere.

Below is sample code:

'use strict';
 
/**
 * Grunt Module
 */
module.exports = function(grunt) {
    grunt.initConfig({
          pkg: grunt.file.readJSON('package.json'),
          
          sass: {
        dist: {
          options: {
            style: 'expanded',
            compass: true,
            sourcemap: false
          },
          files: {
            'dist/css/<%= pkg.name %>.styles.css': ['sass/**/*.scss']
          }
        }
      },
      
      concat: {
        dist: {
          src: ['scripts/**/*.js'],
          dest: 'dist/js/<%= pkg.name %>.scripts.js'
        }
      },
      
      uglify: {
         dist: {
            options: {
               sourceMap: false,
               banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
            },
            files: {
               'dist/js/<%= pkg.name %>.scripts.min.js': ['dist/js/<%= pkg.name %>.scripts.js']
            }
         }
      },
      
      cssmin: {
        minify: {
          src: 'dist/css/<%= pkg.name %>.styles.css',
          dest: 'dist/css/<%= pkg.name %>.styles.min.css'
        }
      },
      
      htmlmin: {
        dist: {
          options: {
            removeComments: true,
            collapseWhitespace: true
          },
          files: {
            'dist/index.html': 'index.html'
          }
        }
      },
    
      copy: {
        main: {
          files: [{
            expand: true,
            cwd: '/',
            src: '**/*.html',
            dest: 'dist/',
            filter: 'isFile',
            rename: function (dest, src) {
              // Change the path name utilize underscores for folders
              return dest + src.replace(/\//g,'_');
            }
          }],
        }
      },
      
      clean: {
        dist: ['dist/']
      },
      
        watch: {
            sass: {
                files: '**/*.scss',
                tasks: ['sass']
            },
            copy:{
              files: '**/*.html',
                tasks: ['sass']
            }
        }
    });
    
    grunt.loadNpmTasks('grunt-contrib-clean');
    grunt.loadNpmTasks('grunt-contrib-sass');
    grunt.loadNpmTasks('grunt-contrib-concat');
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-htmlmin');
    grunt.loadNpmTasks('grunt-contrib-copy');
    grunt.loadNpmTasks('grunt-contrib-watch');
    
    grunt.registerTask('default',['clean', 'sass', 'concat', 'uglify', 'cssmin', 'htmlmin', 'watch']);
};

What am I doing wrong?

0

There are 0 best solutions below