设置PostCSS

时间:2015-12-10 18:43:54

标签: plugins gulp postcss

我只是想设置PostCSS并将其集成到我最近的工作流程中。但不知怎的,我似乎无法让它发挥作用。

我正在使用A Mac和gulp作为任务跑步者。

这是我开始观看任务时遇到的错误:

  

TypeError:$ .postcss不是函数

这就是我的gulpfile.js的样子:

var gulp = require('gulp');
var $ = require('gulp-load-plugins')({
  rename: {
    'browser-sync': 'browserSync',
    'gulp-postcss': 'postcss',
  },
  pattern: ['gulp-*', 'gulp.*', 'del', 'run-sequence', 'browser-sync'],
  DEBUG: false
});



var targetPath = 'dist';

var useBrowserSync = $.util.env.browserSync || true;


gulp.task('sass', function(){
  return gulp.src('src/scss/*.{scss,sass,css}')
    .pipe($.postcss([
        require('precss')()
      ], {syntax: require('postcss-scss')}))
    .pipe(gulp.dest(targetPath + '/public/assets/css'))
    .pipe( $.if( useBrowserSync , $.browserSync.stream() ) );
});

gulp.task('watch', ['sass'], function(){
  if( useBrowserSync ){
   $.browserSync.create();

   $.browserSync.init({
     proxy: 'localhost/my_project/dist/public/'
   });
  }

  gulp.watch('src/scss/*.{scss,sass,css}', ['sass']);
});

出了什么问题?

0 个答案:

没有答案