gulp搭建项目到服务器,利用gulp搭建简单服务器，gulp标准版(示例代码)

var gulp = require(‘gulp‘),

autoprefixer = require(‘gulp-autoprefixer‘), //自动添加css前缀

rename = require(‘gulp-rename‘), //文件重命名

sass = require(‘gulp-sass‘), //sass的编译

minifycss = require(‘gulp-minify-css‘), //压缩css

uglify = require(‘gulp-uglify‘), //压缩js代码

concat = require(‘gulp-concat‘), //合并js文件

rev = require(‘gulp-rev‘), //更改版本名

revCollector = require(‘gulp-rev-collector‘), //rev的插件，用于更改html模版中lib的引用

del = require(‘del‘), //清除文件

livereload = require(‘gulp-livereload‘),

// babel = require(‘gulp-babel‘),//清除文件

jade = require(‘gulp-jade‘), //jade

htmlmin = require("gulp-htmlmin"), //html

connect = require(‘gulp-connect‘), //使用connect启动一个Web服务器

js_pach = [‘app/static/**.js‘, ‘app/static/**/**.js‘, ‘app/template/**.js‘, ‘app/template/**/**.js‘, ‘app/template/**/**.js‘],

//var css_pach = [‘css/ionic_main.css‘,‘css/huodong.css‘,‘css/gouwuche.css‘,‘css/chenggong.css‘];

scss_pach = [‘app/**/**.scss‘, ‘app/**/**/**.scss‘, ‘app/**/**/**/**.scss‘, ‘app/**/**/**/**/**.scss‘],

jade_path = [‘app/template/**.jade‘, ‘app/template/**/**.jade‘, ‘app/template/**/**/**.jade‘, ‘app/template/**/**/**/**.jade‘],

jade2_path = [‘app/static/**.jade‘, ‘app/static/**/**.jade‘, ‘app/static/**/**/**.jade‘],

html_path = [‘app/template/**.html‘, ‘app/template/**/**.html‘, ‘app/template/**/**/**.html‘, ‘app/template/**/**/**/**.html‘],

all_path = js_pach.concat(scss_pach).concat(jade_path).concat(jade2_path).concat(html_path);

gulp.task(‘connect‘, function () {

connect.server({

root: ‘‘,

livereload: true,

port: 8080 //服务器端口

});

});

// gulp.task(‘babel‘, function () {

// return gulp.src(js_pach)

// .pipe(babel({

// compact:false

// }))

// .pipe(concat(‘debug2.js‘))

// .pipe(gulp.dest(‘js‘));

// });

gulp.task(‘jade‘, function () {

return gulp.src(jade_path)

.pipe(jade()).on(‘error‘, function () {

console.log("eroror")

})

.pipe(gulp.dest(‘app/dist/templates‘)).pipe(connect.reload());

})

gulp.task(‘jade2‘, function () {

return gulp.src(jade2_path)

.pipe(jade()).on(‘error‘, function () {

console.log("eroror")

})

.pipe(gulp.dest(‘app/dist‘)).pipe(connect.reload());

});

gulp.task(‘html‘, function () {

return gulp.src(html_path)

.pipe(htmlmin({collapseWhitespace: true,minifyCSS:true,minifyJS:true,removeComments:true,removeEmptyAttributes:true}))

.pipe(gulp.dest(‘app/dist/templates‘)).pipe(connect.reload());

})

gulp.task(‘js‘, [‘cleanjs‘], function () {

return gulp.src(js_pach)

.pipe(concat(‘debug.js‘))

.pipe(gulp.dest(‘app/dist/js‘))

.pipe(concat(‘main.js‘))

.pipe(uglify())

.pipe(rev())

.pipe(gulp.dest(‘app/dist/js‘))

.pipe(rev.manifest())

.pipe(gulp.dest(‘app/dist/js‘))

});

gulp.task(‘cleanjs‘, function (cb) {

return del([‘app/dist/js/main-**.js‘], cb)

});

gulp.task(‘cleancss‘, function (cb) {

return del([‘app/dist/css/main-**.css‘], cb)

});

gulp.task(‘jsrev‘, [‘js‘], function () {

return gulp.src([‘app/dist/js/**.json‘, ‘index.html‘])

.pipe(revCollector({

replaceReved: true

}))

.pipe(gulp.dest(‘‘)).pipe(connect.reload())

});

gulp.task(‘sassrev‘, [‘sass‘], function () {

return gulp.src([‘app/dist/css/**.json‘, ‘index.html‘])

.pipe(revCollector({

replaceReved: true

}))

.pipe(gulp.dest(‘‘)).pipe(connect.reload())

});

gulp.task(‘sass‘, [‘cleancss‘], function () {

return gulp.src(scss_pach)

.pipe(sass({

outputStyle: ‘compressed‘

}).on(‘error‘, sass.logError))

.pipe(concat(‘debug.css‘))

.pipe(gulp.dest(‘app/dist/css‘))

.pipe(concat(‘main.css‘))

.pipe(rev())

.pipe(gulp.dest(‘app/dist/css‘))

.pipe(rev.manifest())

.pipe(gulp.dest(‘app/dist/css‘));

});

gulp.task(‘default‘, function () {

gulp.start(‘connect‘, ‘watch‘);

});

//监视文件变化，自动生成到dist文件夹

gulp.task(‘watch‘, function () {

gulp.watch(js_pach, [‘jsrev‘]);

gulp.watch(scss_pach, [‘sassrev‘]);

gulp.watch(jade_path, [‘jade‘]);

gulp.watch(jade2_path, [‘jade2‘]);

gulp.watch(html_path, [‘html‘]);

});

npm install --save 即可把所依赖的文件下载到本地