Grunt autoprefixer不加前缀

Question

我正在涉足Grunt。我试图写一个任务autoprefix自动我的CSS。

这里是我的Gruntfile

module.exports = function(grunt) { 
    'use strict'; 
    grunt.initConfig({ 
    pkg: grunt.file.readJSON('package.json'), 
    autoprefixer: { 
     options: { 
     browsers: ['last 8 versions'] 
     }, 
     files: { 
     'css/styles.css': 'css/styles.css' 
     } 
    }, 
    watch: { 
     sass: { 
     files: ['sass/**/*.{scss,sass}','sass/_partials/**/*.{scss,sass}'], 
     tasks: ['sass:dist', 'autoprefixer'] 
     }, 
     livereload: { 
     files: ['*.html', '*.php', 'js/**/*.{js,json}', 'css/*.css','img/**/*.{png,jpg,jpeg,gif,webp,svg}'], 
     options: { 
      livereload: true 
     } 
     } 
    }, 
    sass: { 
     dist: { 
     files: { 
      'css/styles.css': 'sass/styles.scss' 
     } 
     } 
    } 
    }); 
    grunt.registerTask('default', ['sass:dist', 'autoprefixer', 'watch']); 
    grunt.loadNpmTasks('grunt-sass'); 
    grunt.loadNpmTasks('grunt-autoprefixer'); 
    grunt.loadNpmTasks('grunt-contrib-watch'); 
}; 

当我运行的呼噜声，它说，它的运行任务的很好，但是当我检查CSS文件，没有被处理。

我错过了什么？ （答案是肯定的，但我想知道什么:)）

Answer 1

livereloadwatch之内的任务对路径非常挑剔。看看我的回答this question。

Answer 2

我想为这个问题提供另一种更简单的解决方案。对于这个海报问题，接受的答案是过度的。 OP的问题是，autoprefixer任务在它应该转换的文件之前缺少一个目标，如dist:。因此：

autoprefixer: { 
    options: { 
    browsers: ['last 8 versions'] 
    }, 
    files: { 
    'css/styles.css': 'css/styles.css' 
    } 
}, 

应该是：

autoprefixer: { 
    options: { 
    browsers: ['last 8 versions'] 
    }, 
    dist: { // Target 
    files: { 
     'css/styles.css': 'css/styles.css' 
    } 
    } 
},