Question

我正在用NPM创建一个taskrunner - 我不想使用Gulp或Grunt ......慢！任务跑步者正在工作，速度很快！但是...... autoprefixer不是前缀。它所拥有的console.logs也没有显示在终端中。看起来它没有被解雇。在将SCSS编译为CSS后，我在一个名为autoPrefix()的函数中调用它。

我有一个带有脚本对象任务的package.json，该任务指向start.js 该文件包含以下代码：

var watch = require('node-watch');
var sass = require('node-sass');
var fs = require('fs');
var browserSync = require('browser-sync');
var autoprefixer = require('autoprefixer');
var postcss = require('postcss');
var inputFile = 'static/scss/compiler.scss';
var outputFile = 'static/css/site.min.css';

/**
 * BrowserSync
 */

browserSync({
    server: "./",
    files: ["./*.html", "static/css/*", "static/js/*"],
    logLevel: "silent",
    notify: false
});


/* AUTOPREFIXER NOT WORKING! */

var autoPrefix = function() {
    postcss([ autoprefixer ]).process({
        from: outputFile,
        to: outputFile
    }).then(function (result) {
        result.warnings().forEach(function (warn) {
            console.warn(warn.toString());
        });
        console.log(result.css);
    });
}


/**
 * Sass Compiler
 */

var compileSass = function(file) {

    sass.render({
        file: inputFile,
        outputStyle: 'compressed'
    }, function(error, result) {
        if (!error) {
            /* Write new file */
            fs.writeFile(outputFile, result.css, function(err) {
                if (!err) {
                    if (file) {
                        autoPrefix();
                        console.log('', '\x1b[34m', 'Done compiling SCSS, after a change in:', '\x1b[0m' + file);
                        console.timeEnd('Speed');
                        console.log('\n');
                    } else {
                        autoPrefix();
                        console.log('  Here we go! Compiling: ' + inputFile + '\n \n' + 'OK done! I\'m watching! ' + '\n');
                    }
                } else {
                    console.log('Hmm something went wrong.. ' + err);
                }
            });
        } else {
            console.log('', '\x1b[31m', 'Error in file: ', '\x1b[0m' + error.file + ' on line: ' + error.line + '\n' + error.message + '\n');
        }
    });
}
compileSass();


/**
 * Watch
 */
watch('static/scss/', function(filename) {
    var file = filename;
    compileSass(file);
    console.time('Speed');
});

我做错了什么？我正在编写它像这里的例子： https://github.com/postcss/autoprefixer#javascript

Answer 1

固定。我不得不将SASS编译结果推送到PostCSS，然后前缀为。

代码在这里：

var watch = require('node-watch');
var sass = require('node-sass');
var fs = require('fs');
var browserSync = require('browser-sync');
var autoprefixer = require('autoprefixer');
var postcss = require('postcss');
var inputFile = 'static/scss/compiler.scss';
var outputFile = 'static/css/site.min.css';
/**
 * BrowserSync, set folders to watch
 * Do not set SCSS folder
 */
browserSync({
    server: "./",
    files: ["./*.html", "static/css/*", "static/js/*"],
    logLevel: "silent",
    notify: false
});

/**
 * Sass Compiler
 */
var compileSass = function(file) {

    sass.render({
        file: inputFile,
        outputStyle: 'compressed'
    }, function(error, result) {

        postcss([ autoprefixer ]).process(result.css).then(function (result) {
            result.warnings().forEach(function (warn) {
                console.warn(warn.toString());
            });

            if (!error) {
                /* Write new file */
                fs.writeFile(outputFile, result.css, function(err) {
                    if (!err) {
                        if (file) {
                            console.log('', '\x1b[34m', 'Done compiling SCSS, after a change in:', '\x1b[0m' + file);
                            console.timeEnd('Speed');
                            console.log('\n');
                        } else {
                            console.log('  Here we go! Compiling: ' + inputFile + '\n \n' + 'OK done! I\'m watching! ' + '\n');
                        }
                    } else {
                        console.log('Hmm something went wrong.. ' + err);
                    }
                });
            } else {
                console.log('', '\x1b[31m', 'Error in file: ', '\x1b[0m' + error.file + ' on line: ' + error.line + '\n' + error.message + '\n');
            }
        });
    });
}
compileSass();

/**
 * Watch
 * On each watch, compile SCSS and start timer
 */
watch('static/scss/', function(filename) {
    var file = filename;
    compileSass(file);
    console.time('Speed');
});

Autoprefixer无法在NPM中工作

1 个答案: