1

我正在使用postcss并且autoprefixer-core无法使其正常工作。

css 正在输出到正确的文件，但 autoprefixer 没有任何效果。我已经使用 NPM 安装了 postcss 和 autoprefixer。它们在我的 gruntfile.js 文件中。Grunt 没有输出任何错误，所以很难调试。

这是我的代码：

module.exports = function( grunt ){
        grunt.loadNpmTasks('grunt-contrib-uglify');
        grunt.loadNpmTasks('grunt-contrib-watch');
        grunt.loadNpmTasks('grunt-contrib-compass');
        grunt.loadNpmTasks('grunt-postcss');

        grunt.initConfig({
            //UGLIFY
            uglify:{
                my_target: {
                    files:{             
                        'js/main.min.js': ['js/main.js']
                    }//files
                }//my target
            },//uglify

            //COMPASS
            compass: {
                dev:{
                    options: {
                        config: 'config.rb'
                    }//options
                }//development mode
            },//compass

            //POST CSS
            postcss: {
                options: {
                    processors: [                       
                        require('autoprefixer-core')({browsers: 'last 2 version'}),
                    ]
                },
                dist: {
                    files: {
                        'css/prefixed/prefixed.css' : 'css/main.css' 
                    }
                }
            },

            //WATCH
            watch:{
                options: {livereload:true},
                scripts: {
                    files: ['js/main.js'],
                    tasks:['uglify']
                },//scripts
                sass: {
                    files: ['sass/**/*.scss'], 
                    tasks: ['compass:dev']
                },//sass
                html: {
                    files: ['*.html']   //watch all html files
                },//html
                postcss: {
                    files: 'css/main.css',
                    tasks: ['postcss']
                }
            }//watch
        }),//init config
        grunt.registerTask('default', ['watch', 'postcss'])
}//exports

我的代码与github上的演示的唯一区别是require('autoprefixer-core')({browsers: 'last 2 version'}). 演示包括.postcss最后。如果我这样做，我会收到一个错误：Fatal error: undefined is not a function.

我在这里想念什么？

4

2 回答 2

0

您需要将 autoprefixer-core 添加到本地 npm-packages。就我而言，它是“autoprefixer”并要求：

require('autoprefixer')({
    browsers: ['last 2 versions']
})

这对我有帮助。

于 2016-04-01T14:09:12.270 回答
0

该browsers值应该last 2 versions是last 2 version

processors: [                       
  require('autoprefixer-core')({browsers: 'last 2 versions'}),
]

有关其他选项，请参阅browserslist#queries

于 2015-08-10T05:20:59.043 回答