• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

danielhusar/gulp-pleeease: Gulp plugin for postprocess CSS with ease

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称(OpenSource Name):

danielhusar/gulp-pleeease

开源软件地址(OpenSource Url):

https://github.com/danielhusar/gulp-pleeease

开源编程语言(OpenSource Language):

JavaScript 100.0%

开源软件介绍(OpenSource Introduction):

gulp-pleeease Build Status

Gulp plugin for pleeease

See pleeease.io for documentation.

Install

npm install --save-dev gulp-pleeease

Example

var gulp     = require('gulp');
var pleeease = require('gulp-pleeease');

gulp.task('css', function () {
  gulp.src('./src/*.css')
  .pipe(pleeease())
  .pipe(rename({
    suffix: '.min',
    extname: '.css'
  }))
  .pipe(gulp.dest('./dest'));
});

You can also use out option (and it's preferable for good sourcemaps):

gulp.task('css', function () {
  gulp.src('./src/*.css')
  .pipe(pleeease({
    out: 'out.min.css'
  }))
  .pipe(gulp.dest('./dest'));
});

Preprocessors support

As simple as it looks, no need for specific gulp modules:

var gulp     = require('gulp');
var pleeease = require('gulp-pleeease');

gulp.task('css', function () {
  gulp.src('./src/*.scss')
  .pipe(pleeease({
    sass: true
  }))
  .pipe(gulp.dest('./dest'));
});

Or maybe, if you have imports:

var gulp     = require('gulp');
var pleeease = require('gulp-pleeease');

gulp.task('css', function () {
  gulp.src('./src/*.scss')
  .pipe(pleeease({
    sass: {
      includePaths: ['path/to/include']
    }
  }))
  .pipe(gulp.dest('./dest'));
});

You can use Sass, LESS or Stylus.

Source map support

Using gulp-sourcemaps. To get good sourcemaps, you should always specify base option in gulp.src. You will get inline sourcemaps.

var gulp       = require('gulp');
var pleeease   = require('gulp-pleeease');
var sourcemaps = require('gulp-sourcemaps');

gulp.task('css', function () {
  gulp.src('./src/*.css', {base: '.'})
    .pipe(sourcemaps.init())
      .pipe(pleeease())
    .pipe(sourcemaps.write())
    .pipe(gulp.dest('./dest'));
});

And even with preprocessors. Here, using Stylus, and with sourcemaps as a separate file:

var gulp       = require('gulp');
var pleeease   = require('gulp-pleeease');
var sourcemaps = require('gulp-sourcemaps');

gulp.task('css', function () {
  gulp.src('./src/*.styl', {base: '.'})
    .pipe(sourcemaps.init())
      .pipe(pleeease({
        stylus: {
          paths: ['path/to/include']
        }
      }))
    .pipe(sourcemaps.write('.'))
    .pipe(gulp.dest('./dest'));
});

Options

Same as pleeease

License

MIT © Daniel Husar




鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
zhalice2011/gulp-postcss: 移动端自适应VW布局-----工作流构建发布时间:2022-06-21
下一篇:
drioemgaoin/GulpMainNpmFiles发布时间:2022-06-21
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap