grunt htmlmin:不要在gruntfile.js中指定filename

时间:2014-09-09 10:33:53

标签: javascript gruntjs grunt-contrib-htmlmin

我的任务如下:

    htmlmin : {
        dist : {
            options : {
                removeComments : true,
                collapseWhitespace : true
            },
            files : {
                'index.html' : 'index-src.html'
            }
        }
    },

当我的网站上只有一个html文件时,这很正常,因此会将index-src.html处理为缩小的index.html

如果我要处理其他100个html文件怎么办?我不想在我的gruntfile中手动列出它们。

我如何抽象文件名并告诉grunt将我的src文件缩小到相应的生产文件?就我而言,他们是:

源文件为[name]-src.html 生产文件是[name].html

我猜这只是语法问题,但我不知道该写些什么。 谢谢! :)

2 个答案:

答案 0 :(得分:3)

请参阅Grunt文档的Globbing Patterns部分。

我相信你只需将你的param文件对象更改为:

'index.html' : '*-src.html'

<强>更新

重新阅读您的问题,我意识到您需要为动态源文件名和目标文件名进行1-1文件转换。

为此,请参阅Building the files object dynamically

我还没有在我的项目中使用它,但语法看起来很直接。您可能需要将src vs production命名约定更改为基于文件夹的约定。

  • /source/name.html(源文件夹)
  • /build/name.html(目标文件夹)

实施例

files: [
    {
      expand: true,     // Enable dynamic expansion.
      cwd: 'source/',      // Src matches are relative to this path.
      src: ['*-src.html'], // Actual pattern(s) to match.
      dest: 'build/',   // Destination path prefix.
      ext: '.html',   // Dest filepaths will have this extension.
      extDot: 'first'   // Extensions in filenames begin after the first dot
    }
]

答案 1 :(得分:0)

module.exports = function (grunt) {

    // 1. All configuration goes here
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        concat: {
            controlCss: {
                src: ['UI.controls/assets/css/*.css'],
                dest: 'UI.controls/assets/css/min/production.css'
            },

            controlJs: {
                src: ['UI.controls/assets/js/*.js'],
                dest: 'UI.controls/assets/js/min/production.js'
            },

            coreJs: {
                src: ['UI.core/assets/js/*.js'],
                dest: 'UI.core/assets/js/min/production.js'
            },
            dist: {
                src: ['UI.controls/assets/templates/*.htm'],
                dest: 'UI.controls/assets/templates/min/production.min.htm'
            }
        },

        cssmin: {
            controlCss: {
                src: 'UI.controls/assets/css/min/production.css',
                dest: 'UI.controls/assets/css/min/production.min.css'
            }
        },

        uglify: {
            controlJs: {
                src: 'UI.controls/assets/js/min/production.js',
                dest: 'UI.controls/assets/js/min/production.min.js'
            },

            coreJs: {
                src: 'UI.core/assets/js/min/production.js',
                dest: 'UI.core/assets/js/min/production.min.js'
            }
        },

        htmlmin: {
            dist: {
                options: {
                    removeComments: true,
                    collapseWhitespace: true
                },
                expand: true,
                cwd: 'build',
                src: ['UI.controls/assets/templates/*.htm'],
                dest: 'UI.controls/assets/templates/min/production.min.htm'
            }
        }

  });

    // 2. Where we tell Grunt we plan to use this plug-in.
    grunt.loadNpmTasks('grunt-contrib-concat');
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-contrib-htmlmin');

    // 3. Where we tell Grunt what to do when we type "grunt" into the terminal.
    grunt.registerTask('default', ['concat', 'cssmin', 'uglify', 'htmlmin']);

};