1.win+r:进入cdm

2.node -v:查询是否安装node
3.npm install -g gulp:安装gulp
4.gulp -v:查看是否安装gulp
5.cd desk:进入桌面
6.cd 20170410:进入文件夹
7.npm init:对文件夹进行重置
8.一些描述,可写可不写:
9.npm install gulp --save-dev:将gulp安装到项目中:
 10.安装多个模块:
 11.npm install gulp-uglify --save-dev:压缩js文件需要安装的模块
12.在根目录文件下新建一个gulpfile.js文件 
 13.引入模块信息
  1. //实现压缩js文件
  2. var gulp = require("gulp");
  3. //实现压缩js文件模块
  4. var uglify = require("gulp-uglify");
  5. var concat = require('gulp-concat');
  6. var open = require('gulp-open');
  7. var connect = require('gulp-connect');
14.创建任务
  1. gulp.task('js', function() {
  2. //1.找到源代码
  3. //*.js:所有的js文件
  4. //.src()找源码路径
  5. gulp.src("src/js/*.js")
  6. .pipe(uglify())//2.进行压缩代码
  7. .pipe(concat('all.js'))//2.5进行合并
  8. .pipe(gulp.dest("./dist/js"))//3.将压缩文件输出
  9. .pipe(connect.reload())//4.检测修改时页面刷新
  10. });
15.添加open模块默认打开浏览器的地址(uri::打开地址)
  1. // uri:打开的地址
  2. gulp.task('open', function(){
  3. gulp.src('src/*.html')
  4. .pipe(open({uri:'http://localhost:8088'}));
  5. });
16.检测是否被修改
  1. gulp.task("auto",function(){
  2. //监听文件修改
  3. gulp.watch('src/js/*.js',['js'])
  4. gulp.watch('src/*.html',['html'])
  5. gulp.watch('src/css/*.css',['css'])
  6. });
17.设置gulp的默认任务
  1. // 设置gulp的默认任务
  2. gulp.task('default', ['connect','open', 'auto','js','html','css']);
18.运行成功:
 

基于node安装gulp-一些命令的更多相关文章

  1. 基于node和npm的命令行工具——tive-cli

    前端开发过程中经常会用到各种各样的脚手架工具.npm全局工具包等命令行工具,如:Vue脚手架@vue/cli.React脚手架create-react-app.node进程守卫工具pm2.本地静态服务 ...

  2. gulp入坑系列(1)——安装gulp

    前言   好吧,我承认我是为了搞定Sass编译CSS文件的问题,迷一样的着手入gulp的坑,sass和gulp的爬坑历程大概会一起更新.然后感觉这里windows和mac的流程差不多,不过mac的通常 ...

  3. 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一)

    相关连接导航 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 执行 $Gulp 时发生了什么 —— 基于 Gulp 的前端集成解决方案(二) 常用 Gulp 插件汇总 ...

  4. 安装 Node 和 gulp

    gulp 是基于 node 实现的,那么我们就需要先安装 node. Node 是一个基于Chrome JavaScript V8引擎建立的一个平台,可以利用它实现 Web服务,做类似PHP的事. 打 ...

  5. 基于node.js的压缩合并安装

    1.构建工具(grunt,gulp) 下载地址:http://gruntjs.cn/http://gruntjs.com/ (1)安装nodejs(http://www.nodejs.org/) 验证 ...

  6. Node.js gulp安装与使用出现问题与解决

    此前使用了最新的4.0之后的gulp版本,出现了一系列的问题. 于是想换回3.9版本 (一)本地与全局都需要安装gulp ①首先卸载原来版本 npm uninstall gulp ②本地与全局分别安装 ...

  7. windows平台下node,npm,gulp配置

    参考文献:http://blog.csdn.net/yuanyuan214365/article/details/53749583 1.安装nodejs:nodejs nodejs安装路径随意 nod ...

  8. npm(cnpm)介绍(安装gulp)

    1.npm(node package manager) nodejs的包管理器,用于node插件管理(安装.卸载.更新.管理依赖等); 2.使用npm安装安装插件: 1).命令提示符执行 npm in ...

  9. 认识Web前端、Web后端、桌面app和移动app新开发模式 - 基于Node.js环境和VS Code工具

    认识Web.桌面和移动app新开发模式 - 基于Node.js环境和VS Code工具 一.开发环境的搭建(基于win10) 1.安装node.js和npm 到node.js官网下载安装包(包含npm ...

随机推荐

  1. 原生 javaScript 百叶窗 效果的实现及原理介绍

    百叶窗大家都见过吧!如图: 原理: 如图所示,空心格子就好比是每个li,给它设定相对定位属性,设置overflow:hidden: 黑块为li子元素,高度为li的2倍,设置absolute属性,我们正 ...

  2. IIS隐藏网站

    IIS隐藏网站 1.站点建立一个文件夹:Test 2.在F盘新建Web文件夹(放要隐藏的网站) 3.右键Test文件夹-新建虚拟目录,虚拟目录指向步骤2 4.删除Test文件夹即可

  3. unix网络编程卷2:进程间通信

    管道没有名字,只能有亲缘关系使用. FIFO也叫有名管道,有名所以没有了这个限制. 管道提供一个单向数据流,创建函数返回两个文件描述符.一个用来读,一个用来写. 宏S_ISFIFO可用于确定一个描述符 ...

  4. 【OCP-12c】2019年CUUG OCP 071考试题库(75题)

    75.Which statements are correct regarding indexes? (Choose all that apply.) A. A non-deferrable PRIM ...

  5. tushare模块的应用

    一.简介以及环境安装 TuShare是一个著名的免费.开源的python财经数据接口包.其官网主页为:TuShare -财经数据接口包.该接口包如今提供了大量的金融数据,涵盖了股票.基本面.宏观.新闻 ...

  6. PHP中运算符优先级

    运算符优先级指定了两个表达式绑定得有多“紧密”.例如,表达式 1 + 5 * 3 的结果是 16 而不是 18 是因为乘号(“*”)的优先级比加号(“+”)高.必要时可以用括号来强制改变优先级.例如: ...

  7. 网卡NAT方式下虚拟机安装FTP服务

    在windows8下安装Oracle VM VirtualBox虚拟机,虚拟机中安装的CentOS操作系统,在CentOS中搭建LNMP环境,安装vsftpd服务器,宿主机在phpStorm编程,将代 ...

  8. Vmware下Kali设置桥接网络无法上网

    1.检查是否设置桥接 2.编辑>首选项>虚拟网络编辑器>选对本机上网的网卡 3.检查上网的网卡>适配器属性栏有没有 Vmware Bridge Protocol 桥接的服务. ...

  9. mxonline实战17,上线部署

    在线演示: http://47.244.22.82 python3+django2.0的环境 需要安装的库pip install django-simple-captcha django-pure-p ...

  10. Java中常用到的文件操作那些事(二)——使用POI解析Excel的两种常用方式对比

    最近生产环境有个老项目一直内存报警,不时的还出现内存泄漏,导致需要重启服务器,已经严重影响正常服务了.获取生成dump文件后,使用MAT工具进行分析,发现是其中有个Excel文件上传功能时,经常会导致 ...