Question

我使用grunt-contrib-less和grunt-contrib-watch在更改后自动编译我的文件。当css不存在时，grunt编译好了。当css已经存在并且watch看到更少的文件发生更改时，不会修改css文件。我必须每次都删除它，让grunt通过修改重新创建它。

less config：

less: {
    options: {
        banner: '<%= meta.banner %>'
    },
    dev: {
        options: {
            sourceMap: true,
            sourceMapFileInline: true,
            compress: true
        },
        src: '<%= meta.dev.less %>/main.less',
        dest: '<%= meta.prod.css %>/main.css'
    },
    prod: {
        options: {
            plugins: [
                new( require( 'less-plugin-clean-css' ) )( {
                    'advanced': true,
                    'compatibility': 'ie9'
                } )
            ],
        },
        src: '<%= meta.dev.less %>/main.less',
        dest: '<%= meta.prod.css %>/main.css'
    }
},

我在Windows 10下，每个用户都有权修改/删除dist文件夹中的文件。我怎样才能让grunt修改css文件？

修改

观看配置

watch: {
    options: {
        livereload: 6325
    },
    js: {
        files: [ '<%= meta.dev.js %>/main.js', '<%= meta.dev.js %>/plugins/*.js' ],
        tasks: [ 'newer:concat' ]
    },
    images: {
        files: '<%= meta.dev.img %>/**/*.{png,jpg,gif,svg}',
        tasks: [ 'newer:imagemin' ]
    },
    css: {
        files: '<%= meta.dev.less %>/**/*.less',
        tasks: [ 'newer:less:dev' ]
    }
}

注册

grunt.registerTask( 'default', [ 'less:dev', 'concat', 'imagemin', 'copy', 'watch' ] );

Grunt输出（详细）

>> File "dev\less\elements\menu.less" changed.
Initializing
Command-line options: --verbose

Reading "Gruntfile.js" Gruntfile...OK

Registering Gruntfile tasks.
Reading package.json...OK
Parsing package.json...OK
Initializing config...OK
Loading "Gruntfile.js" tasks...OK
+ default, prod

Running tasks: newer:less:dev

Loading "grunt-newer" plugin

Registering "D:\[...]\static\node_modules\grunt-newer\tasks" tasks.
Loading "newer.js" tasks...OK
+ any-newer, newer, newer-clean, newer-postrun

Running "newer:less:dev" (newer) task
Options: cache="D:\\[...]\\static\\node_modules\\grunt-newer\\.cache", override=undefined
Files: dev/less/main.less -> dist/css/main.css
No newer files to process.

Answer 1

以下是发生的事情：

您修改menu.less
watch检测到并运行newer:less:dev
less:dev仅使用文件main.less作为来源（不是menu.less）
该文件未更改，因此newer认为不需要再次运行该任务

我认为main.less包含menu.less，但newer不知道。所以我建议的解决方法是摆脱newer部分。

Answer 2

您是否添加了正确的手表配置？

ul {
    margin-bottom: 0px;
}
ul > li {
    display: list-item;
}
#slideshow {
    background: #F0F0F0;
}
#slideshow > .submenu {
    color: #ababab;
    font-family: myFirstFont;
    font-size: 12pt;
    float: left;
    margin-top: 20px;
    margin-right: 2%;
}

.image1 {
    height: 200px; /* The height of the image */
    background: url('/wp-content/themes/wpbootstrap/images/imag_home-1.png') no-repeat 50% 50% fixed;
    -moz-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}

使用您的个人资料运行grunt：grunt.registerTask（＆＃39; myprofile＆＃39;，[＆＃39; less：dev＆＃39;，＆＃39; watch＆＃39;]）;

Grunt less不会替换css文件

2 个答案: