博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
前端构建工具gulp(1)
阅读量:5843 次
发布时间:2019-06-18

本文共 1879 字,大约阅读时间需要 6 分钟。

npm install gulp -g

 2本地生成一个package.json的文件

npm init

 3本地项目中需要安装gulp(项目中需要require)

npm install gulp --save-dev

 4本地下载各个需要的模块,列如:gulp-cssnano,gulp-rename等

npm install gulp-cssnano --save-devnpm insall gulp-rename --save-dev

 

5package.js文件中导入模块:require(模块名)

var gulp = require("gulp");   //引入gulpvar cssnano = require("gulp-cssnano");  //引入css压缩模块var rename = require("gulp-rename");  //引入修改名字模块var uglify = require("gulp-uglify");  //引入压缩js模块var concat = require("gulp-concat");  //引入合并文件模块var imagemin = require("gulp-imagemin");  //引入压缩图片模块var bs = require("browser-sync").create();  //引入自动刷新浏览器模块//task创建要执行的任务,第一个参数是任务的名字,第二个参数是个函数,要执行的任务gulp.task("tick",function () {    console.log("ksfkf");});//压缩css文件任务gulp.task("css",function () {    gulp.src("./css/*.css").pipe(cssnano()).pipe(gulp.dest("./dist/style"));});//修改名字的任务gulp.task("re_css",function () {    gulp.src("./css/*.css").pipe(cssnano()).pipe(rename("index.min.css")).pipe(gulp.dest("./dist/style"));});//压缩js文件gulp.task("script",function () {    gulp.src("./js/*.js").pipe(uglify()).pipe(rename({suffix:".min"})).pipe(gulp.dest("./dist/script"));});//合并文件gulp.task("cendor",function () {    gulp.src(["./js/but.js","./js/nav.js"]).pipe(concat("index.min.js")).pipe(uglify()).pipe(gulp.dest("./dist/script"));});//压缩图片gulp.task("img",function () {    gulp.src("./images/*.*").pipe(imagemin()).pipe(gulp.dest("./dist/images"));});//监听事件gulp.task("watch",function () {    gulp.watch("./css/*.css",["css"])});//自动刷新浏览器时间gulp.task("bs",function () {    bs.init({        "server":{            "baseDir":"./"        }    });});gulp.task("bs_css",function () {    gulp.src("./css/*.css").pipe(cssnano()).pipe(gulp.dest("./dist/style")).pipe(bs.stream());});gulp.task("bs_watch",function () {    gulp.watch("./css/*.css",["bs_css"])});gulp.task("defult",["bs","bs_watch"]);

 

转载于:https://www.cnblogs.com/yan-peng/p/10072997.html

你可能感兴趣的文章
阿里数据中台七年演化史——行在口述干货
查看>>
linux常用命令
查看>>
10.Java异常问题
查看>>
希迪智驾自动驾驶落地新思路:V2X + L4级自动驾驶货车,“落地”才是要务
查看>>
利用Git Webhooks实现jekyll博客自动化部署
查看>>
Fescar undoExecutor介绍
查看>>
Linux命令操作大全
查看>>
从周五开始香港主机特别慢,香港主机用户有同感吗?
查看>>
VAVA宠物机器人来了,可实现远程互动以及自动投食
查看>>
使用VMware安装CentOS7详请
查看>>
Ember.js 3.9.0-beta.3 发布,JavaScript Web 应用开发框架
查看>>
python标准库00 学习准备
查看>>
4.2. PHP crypt()
查看>>
Winform开发框架之附件管理应用
查看>>
软链接文件和硬链接文件
查看>>
Spring Cloud Config服务器
查看>>
commonservice-config配置服务搭建
查看>>
连接池的意义及阿里Druid
查看>>
ComponentOne 2019V1火热来袭!全面支持 Visual Studio 2019——亮点之WinForm篇
查看>>
全面的Spring Boot配置文件详解
查看>>