gulp-nodemon 和 gulp-livereload 配置
迁移 Gulp API 初探和 gulp-nodemon gulp-livereload 配置
一、gulp 安装
1. 全局安装:
npm install -g gulp
2. 安装在项目开发环境:
npm install gulp --save-dev
二、gulp-nodemon 和 gulp-livereload 安装
gulp-nodemon 是重启服务器的插件。
gulp-livereload 后端控制前端同步刷新,不过需要依赖 chrome 插件 LiveReload
安装:
npm install gulp-nodemon gulp-livereload --save-dev
为了能让服务器可以控制 chrome 自动刷新,需要安装 LiveReload 插件。
三、gulpfile.js 配置
在工程的目录下,新建 gulpfile.js 文件。如下简单的配置:
'use strict'; //引入 gulp 和 nodemon livereload 插件 var gulp = require('gulp'); var nodemon = require('gulp-nodemon'); var livereload = require('gulp-livereload'); // 一些文件的路径 var paths = { client: [ 'client/javascripts/**/*.js', 'client/stylesheets/**/*.css' ], server: { index: 'app.js' } }; // nodemon 的配置 var nodemonConfig = { script : paths.server.index, ignore : [ "tmp/**", "public/**", "views/**" ], env : { "NODE_ENV": "development" } }; // 使用 nodemone 跑起服务器 gulp.task('serve', ['livereload'], function() { return nodemon(nodemonConfig); }); // 当客户端被监听的文件改变时,刷新浏览器 gulp.task('livereload', function() { livereload.listen(); var server = livereload(); return gulp.watch(paths.client, function(event) { server.changed(event.path); }); }); // develop 任务, 同时开启 serve、livereload 任务 gulp.task('develop', ['serve', 'livereload']);
这里只是分享了关于 gulp-nodemon 与 gulp-livereload 插件的使用。更多 gulp api语法可以查看笔者博文: