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. 30个你 “ 不可能全部会做 ” 的javascript题目-答案解释

    题目链接:http://www.cnblogs.com/0603ljx/p/4458127.html 1,D map对数组的每个元素调用定义的回调函数并返回包含结果的数组.["1" ...

  2. Android / iOS 招聘

    1. 面试题 https://github.com/ChenYilong/iOSInterviewQuestions 2. 一些不错的idea CDI - Développeur iOS/Androi ...

  3. Vue的基本认识与使用

    什么是Vue? Vue是一个渐进式的js框架,采用的是MVVM模式的双向绑定, Vue的使用 引入vue        <script src="vuejs/vue.js"& ...

  4. django系列6--Ajax06 使用插件,Sweet-Alert插件

    使用SweetAlert插件 GitHub上的下载链接 下载完成后放入django项目静态目录下,在html文件中引入静态文件,下面是script部分 $(".btn-danger" ...

  5. shell、cmd、dos和脚本语言区别和联系

    问题一:DOS与windows中cmd区别   在windows系统中,“开始-运行-cmd”可以打开“cmd.exe”,进行命令行操作. 操作系统可以分成核心(kernel)和Shell(外壳)两部 ...

  6. Java多线程原理及Thread类的使用

    一.进程与线程的区别 1.进程是应用程序在内存总分配的空间.(正在运行中的程序) 2.线程是进程中负责程序执行的执行单元.执行路径. 3.一个进程中至少有一个线程在负责进程的运行. 4.一个进程中有多 ...

  7. Linux 下的 netfilter 认识与常规操作

    Linux 下的 netfilter 认识与常规操作 前言 博客写到今天,1年7个月.可是包含所有写作经历,这个时间线可以达到三年. 上次更新了一篇 "镇站之宝" ,也是本站阅读量 ...

  8. 利用wxpy进行微信信息发送详解(一)

    利用wxpy进行微信信息自动发送,简直是骚扰神器,除非拉黑你. 那我们就来设置一个场景吧,五秒发送一次,一次发送10条 首先我们来整理一下思路: ♦1.首先我们要从网上爬去我们想要发送的内容 ♦2.登 ...

  9. select子句排列顺序与聚集函数

    selcet   要返回的列或表达式 from   从中检索数据的表 where    行级过滤 group by 分组说明 having 组级过滤 order by  输出排列顺序   ASC正序排 ...

  10. Vultr VPS建站攻略 – 一键安装宝塔面板架设LNMP/LAMP Web环境

    我们选择VULTR VPS建站的还是比较多的,其主要原因在于商家的稳定,毕竟我们用来建站选择服务器价格考虑的不是主要的(当然VULTR价格也是比较便宜),最为主要的是因为VULTR商家比较稳定,而且多 ...