使用 Grunt 压缩 HTML 中的类名和 id

Posted 2023-03-15

【中文标题】使用 Grunt 压缩 HTML 中的类名和 id

【英文标题】：Compressing class names and ids in HTML with Grunt

【发布时间】：2015-03-07 19:15:27

【问题描述】：

<div class="aAA J-KU-Jg J-KU-Jg-K9" ></div>

Gmail 使用的这种压缩方法的名称是什么，是否有用于它的 grunt 模块？ 该方法扫描每个js、css和html文件，并缩短类名和id。

【问题讨论】：

我很确定 Google 使用 Closure 工具，例如closure-stylesheets.

【参考方案1】：

你可以试试 grunt-class-id-minifier：

grunt.initConfig(
    class-id-minifier: 
        simple: 
            options: 
                jsMapFile: 'tmp/simple/map.js',
                jsMapDevFile: 'tmp/simple/map.dev.js',
                minifyFilter: function (k, type) 
                    // type.id type.className
                    // J_ ignored in minified html
                    return /^J_/.test(k) ? false : true;

                ,
                jsMapFilter: function (k, type) 
                    // className ignored in js map
                    return !!type.id;
                
            ,
            files: [
                
                    expand: true,
                    cwd: 'test/fixtures/simple/',
                    src: '*.html,css',
                    dest: 'tmp/simple/'
                
            ]
        
    
);

https://www.npmjs.com/package/grunt-class-id-minifier