首页 > 代码库 > 认识Gulp
认识Gulp
gulp详细入门教程:http://www.ydcss.com/archives/18
安装gulp
前提:已经安装node.js、npm
$ npm install gulp --save-dev
gulp-sass:将scss编译成css的gulp插件
安装gulp-sass
$ npm install gulp-sass --save-dev
新建package.js文件
基于node.js项目必不可少的配置文件。
{ "name": "gulpText", "version": "3.0.0", "scripts": { "init": "npm install" }, "devDependencies": { "gulp": "^3.9.1", "gulp-sass": "^2.3.2", } }
新建gulpfile.js文件
var gulp = require(‘gulp‘); var sass=require(‘gulp-sass‘); gulp.task(‘testSass‘,function(){ gulp.src(‘distn/styles/main.scss‘) //该任务针对的文件 .pipe(sass()) //该任务调用的模块 .pipe(gulp.dest(‘src/css‘)); //将会在src/css下生成index.css }); gulp.task(‘default‘,[‘testSass‘]);
运行gulp
右键gulpfile.js文件,选择”Show Gulp Tasks”,打开Gulp窗口,双击需要运行的任务即可。
gulp-concat:合并js文件
安装gulp-concat插件
$ npm install gulp-concat --save-dev
var concat = require(‘gulp-concat‘); gulp.task(‘testVendor‘, function () { gulp.src([‘client/vendor/jquery.min.js‘, ‘client/vendor/angular.min.js‘]) .pipe(concat(‘vendor2.js‘)) .pipe(gulp.dest(‘src/js‘)); }); gulp.task(‘default‘, [‘testVendor‘]);
认识Gulp
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。