javascript - 创建一个类名的构建系统

Closed. This question needs to be more focused。它当前不接受答案。
                            
                        
                    
                
                            
                                
                
                        
                            
                        
                    
                        
                            想改善这个问题吗？更新问题，使其仅通过editing this post专注于一个问题。
                        
                        4年前关闭。
                                                                                            
                
        
我的问题基于以下问题：https://www.quora.com/How-do-Facebook-structure-their-CSS-class-names

Facebook＆Google使用某种构建系统将类名（开发人员在语义上理解为）转换为短名称，这些短名称在带宽上很容易，从而创建了压缩代码。

那么，我们如何创建该构建系统？如果只是在PHP方面更改类名，那是另一回事。但是，必须在CSS和Javascript方面更改相同的类。那么，在执行此操作时如何保持所有内容不变？

如果没有构建系统，则像“ ._4q7-”和“ ._4q82”之类的类将无法正常工作。

我正在使用PHP，MySQL，JQuery ...

最佳答案

如果您使用的是Gulp，这似乎是正确的方法：

https://github.com/calebthebrewer/gulp-selectors

照顾到CSS，JS和HTML之间的选择器一致性。还提供了处理自定义文件的功能，因此它可以与其他类型的视图一起使用，而不仅限于纯HTML文件。

var processors = {
    'css':  ['scss', 'css'],        // run the css processor on .scss and .css files
    'html': ['haml'],               // run the html processor on .haml files
    'js-strings':   ['js']          // run the js-strings plugin on js files
},
ignores = {
    classes: ['hidden', 'active']   // ignore these class selectors,
    ids: '*'                        // ignore all IDs
};

gs.run(processors, ignores);