节点/咕噜 - Autoprefixer - 如何添加配置到我的Gruntfile.js及如何检

2019-10-18 17:52发布

我想开始使用CSS后处理器称为autoprefixer( https://github.com/ai/autoprefixer )。

后一点的杂耍周围的事物,其实我得到了这个工作,因为我是一个绝对的节点,咕噜和终端初学者这是相当惊人的我。
在autoprefixer文档 ,它说一个可以配置浏览器的支持,说明这行代码给出:

autoprefixer("last 1 version", "> 1%", "ie 8", "ie 7").compile(css);

但是,在我把这个代码? 我试图把它粘贴到底部我Gruntfile没有成功。 该文件是这样的:

module.exports = function (grunt) {
    grunt.initConfig({
        autoprefixer: {
            dist: {
                files: {
                    'build/style.css': 'style.css'
                }
            }
        },
        watch: {
            styles: {
                files: ['style.css'],
                tasks: ['autoprefixer']
            }
        }
    });
    grunt.loadNpmTasks('grunt-autoprefixer');
    grunt.loadNpmTasks('grunt-contrib-watch');
};

我也尝试添加这样的:

autoprefixer: {
    options: {
      browsers: ["last 10 version", "> 1%", "ie 8", "ie 7"]
    },
    dist: {
        files: {
            'build/style.css': 'style.css'
        }
 },

这无疑对CSS输出的影响,但我不知道这是否是正确的吗?

此外,当我键入autoprefixer -i进入命令行来检查我的配置,输出-bash: autoprefixer: command not found 。 这同样适用于grunt-autoprefixer -i 。 我怎样才能解决这个问题? 我很想看到我支持的版本。
另一个变化是不喜欢这样写道:

inspect = autoprefixer("last 1 version").inspect();
console.log(inspect);

但同样,当把这个代码?

Answer 1:

您需要安装全球对autoprefixer有autoprefixer命令:

sudo npm install -g autoprefixer
autoprefixer -i


Answer 2:

现在你可以使用Autoprefixer二进制从项目文件夹没有全球的装机量Autoprefixer(不要忘记更新咕噜-autoprefixer至v0.4.1)。

在这里你可以找到browsers选项的说明。 选项可以是靶或特定任务和特定目标的选项可以覆盖任务特定的。



文章来源: Node/Grunt - Autoprefixer - How to add configuration to my Gruntfile.js & how to check supported browsers?