1

Grunt.js concat と cssmin を異なるディレクトリから使用して、複数の CSS ファイルを縮小して結合しようとしています。残念ながら、各 CSS にはリソースへの相対リンクがあるため、css は壊れます。次に例を示します。

background-image: url('images/background.jpg');

私はウェブでその答えを見つけようとしていましたが、運がありませんでした。以下は、2 つの異なる WP プラグイン CSS ファイルを組み合わせた Gruntfile.js コードの例です。

module.exports = function (grunt) {
grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    concat: {
        iphorm_woocommerce: {
            src: [
                '../wp-content/plugins/iphorm-form-builder/css/styles.css',
                '../wp-content/plugins/woocommerce/assets/css/select2.css',
                '../wp-content/plugins/woocommerce/assets/css/woocommerce-layout.css',
                '../wp-content/plugins/woocommerce/assets/css/woocommerce-smallscreen.css',
                '../wp-content/plugins/woocommerce/assets/css/woocommerce.css',
            ],
            dest: '../wp-content/plugins/woocommerce/assets/css/combined.css'
        }
    }
    })
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.registerTask('default', ['concat']);
};
4

1 に答える 1