gulp--sass

gulp:复制文件在一个临时的地方并进行修改,i/o任务只在开始和结束,节省i/o流

1. 作为项目的开发依赖(devDependencies)安装:

$ npm install --save-dev gulp

2. 在项目根目录下创建一个名为 gulpfile.js 的文件:

var gulp = require('gulp');
gulp.task('default', function() {
// 将你的默认的任务代码放在这
});

3. 安装sass为项目依赖和安装autoprefixer

$ npm install gulp-sass
$ npm install autoprefixer

4. 完整代码(添加任务)

var gulp = require('gulp');
var sass = require('gulp-sass');
var autoprefixer = require('gulp-autoprefixer');//自动修复插件

gulp.task('default', function() {
  console.log("hello");// 将你的默认的任务代码放在这
});

gulp.task('stream', function () {
    // Endless stream mode
    gulp.watch('css/**/*.css', ['styles'])//监测scss文件的改动
});

gulp.task('styles', function() {
    gulp.src('sass/**/*.scss')
        .pipe(sass())//把scss转为css
        .pipe(sass().on('error', sass.logError))//插入sass日志错误函数,更改默认行为,以便统一修改
        .pipe(autoprefixer({
            browsers: ['last 2 versions']
        }))
        .pipe(gulp.dest('./css'));//把转好的css文件存入css文件夹
})
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值