裴昌会,乐事薯片广告,李文东博客
(1)下载:
(2)安装完成后添加环境变量
c:\users\administrator\appdata\roaming\nvm
(3)修改settings.txt,将npm镜像改为淘宝的镜像
在你安装的目录下找到settings.txt文件,打开后加上 node_mirror: https://npm.taobao.org/mirrors/node/ npm_mirror: https://npm.taobao.org/mirrors/npm/
(4)安装node
nvm install node 6.4.0 nvm list nvm use 6.4.0
npm init 生成一个package.json npm install gulp -g 全局 npm install gulp --save-dev 本地
在项目根目录创建 gulpfile.js,里面代码如下
var gulp = require("gulp"); gulp.task("greet",done => { console.log('hello world'); done(); });
终端输入命令执行任务:gulp greet
主要对css文件进行压缩,然后再将压缩的文件放到指定目录
安装插件
npm install cssnano --save-dev
gulpfile.js代码
var gulp = require("gulp"); var cssnano = require("gulp-cssnano") gulp.task("greet",done => { console.log('hello world'); done(); }); gulp.task("css",done =>{ gulp.src("./css/*.css") .pipe(cssnano()) .pipe(gulp.dest("./dest/css/")) done(); })
安装插件
npm install gulp-rename --save-dev
gulpfile.js
var cssnano = require("gulp-cssnano") var rename = require("gulp-rename") gulp.task("css",done =>{ gulp.src("./css/*.css") .pipe(cssnano()) .pipe(rename({"suffix":".min"})) .pipe(gulp.dest("./dest/css/")) done(); })
安装插件
npm install gulp-uglify --save-dev
gulpfile.js
var uglify = require("gulp-uglify") gulp.task("js",done =>{ gulp.src("./js/*.js") .pipe(uglify({ 'toplevel':true, 'compress':{ 'drop_console':true } })) .pipe(rename({"suffix":".min"})) .pipe(gulp.dest("./dest/js/")) done(); })
安装插件
npm install gulp-concat --save-dev
gulpfile.js
var uglify = require("gulp-uglify") var concat = require("gulp-concat") gulp.task("js",done =>{ gulp.src("./js/*.js") .pipe(concat("index.js")) //拼接成一个文件 .pipe(uglify({ 'toplevel':true, 'compress':{ 'drop_console':true } })) .pipe(rename({"suffix":".min"})) .pipe(gulp.dest("./dest/js/")) done(); })
安装插件
npm install gulp-tinypng-nokey -–save-dev
gulpfile.js
var tinypng_nokey = require('gulp-tinypng-nokey') gulp.task("images",done =>{ gulp.src("./images/*.*") .pipe(tinypng_nokey()) .pipe(gulp.dest("./dest/images/")) done(); });
终端命令;gulp images
gulp.task('auto',function () { gulp.watch('./css/*.css', gulp.series('css')); })
修改代码后,自动执行相应的任务
安装插件
npm install browser-sync -–save-dev
gulpfile.js
var bs = require("browser-sync").create(); gulp.task("css",done =>{ gulp.src("./css/*.css") .pipe(cssnano()) .pipe(rename({"suffix":".min"})) .pipe(gulp.dest("./dest/css/")) .pipe(bs.reload({ stream: true })) done(); }); gulp.task('auto',function () { gulp.watch('./css/*.css', gulp.series('css')); }); gulp.task("bs",function () { bs.init({ 'server':{ 'basedir':'./', } }) }); gulp.task("server",gulp.parallel('bs','auto'));
var gulp = require("gulp"); var cssnano = require("gulp-cssnano"); var rename = require("gulp-rename"); var uglify = require("gulp-uglify"); var concat = require("gulp-concat"); var tinypng_nokey = require('gulp-tinypng-nokey') var bs = require("browser-sync").create(); gulp.task("greet",done => { console.log('hello world'); done(); }); gulp.task("css",done =>{ gulp.src("./css/*.css") .pipe(cssnano()) .pipe(rename({"suffix":".min"})) .pipe(gulp.dest("./dest/css/")) .pipe(bs.reload({ stream: true })) done(); }); gulp.task("js",done =>{ gulp.src("./js/*.js") .pipe(concat("index.js")) //拼接成一个文件 .pipe(uglify({ 'toplevel':true, 'compress':{ 'drop_console':true } })) .pipe(rename({"suffix":".min"})) .pipe(gulp.dest("./dest/js/")) done(); }); gulp.task("images",done =>{ gulp.src("./images/*.*") .pipe(tinypng_nokey()) .pipe(gulp.dest("./dest/images/")) done(); }); gulp.task('auto',function () { gulp.watch('./css/*.css', gulp.series('css')); }); gulp.task("bs",function () { bs.init({ 'server':{ 'basedir':'./', } }) }); gulp.task("server",gulp.parallel('bs','auto'));
修改完代码自动刷新浏览器
如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复
Python 实现将numpy中的nan和inf,nan替换成对应的均值
python爬虫把url链接编码成gbk2312格式过程解析
网友评论