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. Ecliplse转IDEA的学习思路

    很多用户都是先学习了 Eclipse.MyEclipse 再转到 IntelliJ IDEA 的,这里需要先说明的是,在学习 IntelliJ IDEA 过程中,你暂且要放下 Eclipse 下的开发 ...

  2. WebService-php- 1(16)

    最近看了挺多关于php中webservice的资料,感谢燕十八的分享,帮助了我构建服务端的过程.将学习笔记记录如下,其中包含燕十八的笔记. WebService 1 快速了解WebService 通俗 ...

  3. LOJ#6045. 「雅礼集训 2017 Day8」价(最小割)

    题面 传送门 题解 首先先把所有权值取个相反数来求最大收益,因为最小收益很奇怪 然后建图如下:\(S\to\)药,容量\(\inf+p_i\),药\(\to\)药材,容量\(\inf\),药材\(\t ...

  4. [Objective-C语言教程]复合对象(33)

    在Objective-C中,可以在类集群中创建子类,该类集合定义了一个嵌入在其中的类. 这些类对象是复合对象.你可能想知道什么是类集群,下面首先了解什么是类集群. 1. 类集群 类集群是基础框架广泛使 ...

  5. json和csv文件存储

    一. json 1:基本概念 1.1 Json和Javascript JSON, 全称JavaScript Object Notation,它通过对象和数组的组合来表示数据.在JavaScript中一 ...

  6. leetcode-482-License Key Formatting

    题目描述: You are given a license key represented as a string S which consists only alphanumeric charact ...

  7. Mysql 四种事务隔离介绍以及锁机制

    还有很多不太懂,这里收集几份大佬文章“飞机票”,待我整理好了,再好好写一篇文章吧. MySQL的四种事务隔离级别 https://www.cnblogs.com/huanongying/p/70215 ...

  8. 【Quartz】基本原理

    1 核心概念 1.1    核心元素 (1)Scheduler 任务调度器,是Quartz框架的核心,负责管理其他组件. (2)Trigger 触发器,用于定义任务调度的时间规则,有SimpleTri ...

  9. IDEA External libraries 不显示Maven中引入的repository

    原文:https://blog.csdn.net/dj_dengjian/article/details/88668012 记录一下遇到的这个问题的解决方法,也是困惑了半天,感觉这是maven的bug ...

  10. Git、Github、码云 笔记汇总

    从本地恢复码云的项目 把本地项目同步到码云 CBoard 基于0.4.1的旧版本的分支修改合并到0.4.2新版本里面 通过git命令行把一个分支的其中一个commit(提交)合并到另外一个分支里面去