こんにちは、postcss レイアウトで font-awesome を使用しようとしていますが、うまくいかないようです。だから私は投稿でsassをインストールして、それが機能するかどうかを確認しようとしましたが、どうすればよいかわかりません。
私はすでにsass用にnpm gulpをインストールしています
これは私のgulpファイル構成です
var gulp = require('gulp'),
gutil = require('gulp-util'),
webserver = require('gulp-webserver'),
postcss = require('gulp-postcss'),
autoprefixer = require('autoprefixer'),
precss = require('precss'),
cssnano = require('cssnano'),
animation = require('postcss-animation'),
sass = require('gulp-sass'),
source = 'process/css/',
dest = 'builds/postcss/';
gulp.task('html', function() {
gulp.src(dest + '*.html');
});
gulp.task('css', function() {
gulp.src(source + 'style.css')
.pipe(postcss([
precss(),
animation(),
autoprefixer(),
cssnano()
]))
.on('error', gutil.log)
.pipe(gulp.dest(dest + 'css'));
});
gulp.task('watch', function() {
gulp.watch(source + '**/*.css', ['css']);
gulp.watch(dest + '**/*.html', ['html']);
});
gulp.task('webserver', function() {
gulp.src(dest)
.pipe(webserver({
livereload: true,
open: true
}));
});
gulp.task('default', ['html', 'css', 'webserver','watch']);
そして、このsass構成を追加しようとしています
var gulp = require('gulp');
var postcss = require('gulp-postcss');
var sass = require('gulp-sass');
var autoprefixer = require('autoprefixer');
var cssnano = require('cssnano');
gulp.task('css', function () {
var processors = [
autoprefixer,
cssnano
];
return gulp.src('./src/*.scss')
.pipe(sass().on('error', sass.logError))
.pipe(postcss(processors))
.pipe(gulp.dest('./dest'));
});