Question

您好，我参与了很多项目，我有这个问题......

我们所有人都知道在Wordpress中更好地将所有CSS文件组合在一起但另一方面有一个帖子页面使用CSS从未在主页面中使用过类别页面使用CSS从未在主页面或帖子页面中使用。

通常我将CSS潜入文件 我会举例说明你的理解。

style.css（包含所有共享和基本CSS）

main.css（主页）

category.css

page.css

vote.css（对于在主+单页中使用的投票块）

blockStyle1.css（主要+类别中使用的一个块的样式）

....

我最终要拨打类别页面

style.css

category.css

blockstyle1.css

....

。

我尝试完成的是类别，例如运行时的这3个文件将合并为一个文件

所以我会保留我的分割文件的想法+最小化对服务器的请求。

Answer 1

Grunt是你的答案。 Grunt是一个多功能的任务经理，可满足各种需求。在您的情况下，它在那里等待您的样式表的更改，并且当文件被保存时，它将它们合并到一个文件中，最小化它。

如何实施Grunt？这很简单：

首先，在您的机器中安装Grunt并按照本页中的说明创建项目：http://gruntjs.com/getting-started

现在让我们用适当的贡献创建你的Gruntfile.js（http://gruntjs.com/sample-gruntfile）

你项目的Gruntfile.js应该是seguent：


module.exports = function (grunt) {

    grunt.initConfig({

        pkg: grunt.file.readJSON('package.json'),

        concat: {
            dist: {
                src: ['css/*.css'],
                dest: 'style.css'
            }
        },

        watch: {
            css: {
                files: ['css/*.css'],
                tasks: ['concat']
            }
        }
    });

    grunt.loadNpmTasks('grunt-contrib-concat');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.registerTask('default', ['watch']);
};

通过项目目录中的命令行启动grunt并进行样式更改。

P.S。您对使用Sass的看法如何？了解http://sass-lang.com/，http://compass-style.org/和https://github.com/gruntjs/grunt-contrib-compass

Answer 2

简单的你可以使用更好的WordPress Minify Wordpress插件..

https://wordpress.org/plugins/bwp-minify/installation/

在PHP中结合CSS文件和minfie（wordpress）

2 个答案: