Странная проблема в Grunt - js и css файлы index.html не минимизируются, но остальные html файлы - PullRequest
0 голосов
/ 03 июля 2019

Я использую Grunt для запуска веб-приложения, состоящего из 3 html-страниц - aboutus.html, index.html и contactus.html.

Я использую команду grunt build для создания копии этихфайлы в другой папке с некоторыми грубыми изменениями, такими как минимизация 'js' и 'css'.Только на главной странице index.html - ссылки js и css не уменьшаются для ссылки на новый файл js и css, который создается при запуске grunt build.

JS и ссылки CSS в index.htmlоригинал:

<!-- Bootstrap CSS -->
<!-- build:css css/main.css-->
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="node_modules/bootstrap-social/bootstrap-social.css">
<link rel="stylesheet" href="css/styles.css">
<!-- endbuild -->

<!-- jQuery first, then Popper.js, then Bootstrap JS. -->
<!-- build:js js/main.js -->
<script src="node_modules/jquery/dist/jquery.slim.min.js"></script>
<script src="node_modules/popper.js/dist/umd/popper.min.js"></script>
<script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="js/scripts.js"></script>
<!-- endbuild -->

Они не конвертируются.aboutus.html имеет те же самые точные ссылки, указанные таким же образом.Но после выполнения grunt build эти строки в новой копии изменяются следующим образом:

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="css/main.a92351378a85b6243a24.css">

<!-- jQuery first, then Popper.js, then Bootstrap JS. -->
<script src="js/main.0241dcdce9d2407f69f1.js">

Ниже приведены все мои Gruntfile.js.с помощью Grunt я планирую переместить все мои файлы в моей текущей папке в папку с именем «dist», где «dist» - это папка в моей текущей папке.

'use strict';

module.exports = function (grunt) {

require('time-grunt')(grunt);

require('jit-grunt')(grunt, {
    useminPrepare: 'grunt-usemin'
});
grunt.initConfig({
    sass: {
        dist: {
            files: {
                'css/styles.css': 'css/styles.scss'
            }
        }
    },
    watch: {
        files: 'css/*.scss',
        tasks: ['sass']
    },
    browserSync: {
        dev: {
            bsFiles: {
                src: [
                    'css/*.css',
                    '*.html',
                    'js/*.js'
                ]
            },
            options: {
                watchTask: true,
                server: {
                    baseDir: './'
                }
            }
        }
    },
    copy: {
        html: {
            files: [
            {
                //for html
                expand: true,
                dot: true,
                cwd: './',
                src: ['*.html'],
                dest: 'dist'
            }]
        },
        fonts: {
            files: [
            {
                //for font-awesome
                expand: true,
                dot: true,
                cwd: 'node_modules/font-awesome',
                src: ['fonts/*.*'],
                dest: 'dist'
            }]
        }
    },

    clean: {
        build: {
            src: ['dist/']
        }
    },
    imagemin: {
        dynamic: {
            files: [{
                expand: true,                  // Enable dynamic expansion
                cwd: './',                   // Src matches are relative to this path
                src: ['img/*.{png,jpg,gif}'],   // Actual patterns to match
                dest: 'dist/'                  // Destination path prefix
            }]
        }
    },

        useminPrepare: {
    foo: {
                    dest: 'dist',
                    src: ['contactus.html', 'aboutus.html', 'index.html']
    },
            options: {
                    flow: {
                        steps: {
                                css: ['cssmin'],
                                js:['uglify']
                        },
                        post: {
                                css: [{
                                    name: 'cssmin',
                                    createConfig: function (context, block) {
                                        var generated = context.options.generated;
                                        generated.options = {
                                            keepSpecialComments: 0, rebase: false
                                        };
                                    }       
                                }]
                        }
                    }
            }
        },

// Concat
concat: {
        options: {
            separator: ';'
        },

    // dist configuration is provided by useminPrepare
    dist: {}
},

// Uglify
uglify: {
    // dist configuration is provided by useminPrepare
        dist: {}
},

cssmin: {
        dist: {}
},

// Filerev
filerev: {
        options: {
            encoding: 'utf8',
            algorithm: 'md5',
            length: 20
        },

    release: {
        // filerev:release hashes(md5) all assets (images, js and css )
        // in dist directory
            files: [{
                src: [
                    'dist/js/*.js',
                    'dist/css/*.css',
                ]
            }]
    }
},

// Usemin
// Replaces all assets with their revved version in html and css files.
// options.assetDirs contains the directories for finding the assets
// according to their relative paths
usemin: {
    html: ['dist/index.html','dist/contactus.html','dist/aboutus.html'],
        options: {
        assetsDirs: ['dist', 'dist/css','dist/js']
        }
},

htmlmin: {                                         // Task
        dist: {                                        // Target
            options: {                                 // Target options
                    collapseWhitespace: true
            },
            files: {                                   // Dictionary of files
                'dist/index.html': 'dist/index.html',  // 'destination': 'source'
                'dist/contactus.html': 'dist/contactus.html',
                'dist/aboutus.html': 'dist/aboutus.html',
                }
        }
}

});

grunt.registerTask('css', ['sass']);
grunt.registerTask('default', ['browserSync', 'watch']);
grunt.registerTask('build', [
    'clean',
    'copy',
    'imagemin',
    'useminPrepare',
    'concat',
    'cssmin',
    'uglify',
    'filerev',
    'usemin',
    'htmlmin'
]);
}

Пожалуйста, дайте мне знать, еслиМне нужно больше информации, чтобы понять проблему.

...