【Gulp自动化构建工具】

一:入门指南安装gulp网址:https://www.gulpjs.com.cn/docs/getting-started/

1. 全局安装 gulp:

$ npm install --global gulp

2. 作为项目的开发依赖(devDependencies)安装:

$ npm install --save-dev gulp

3. 在项目根目录下创建一个名为 gulpfile.js 的文件:

var gulp = require(‘gulp‘);

gulp.task(‘default‘, function() {

// 将你的默认的任务代码放在这

});

4. 运行 gulp:

$ gulp

默认的名为 default 的任务(task)将会被运行,在这里,这个任务并未做任何事情。

想要单独执行特定的任务(task),请输入 gulp <task> <othertask>。

下一步做什么呢?

你已经安装了所有必要的东西,并且拥有了一个空的 gulpfile。那怎样才算是__真的__入门了呢?可以查看这些 秘籍 和这个 文章列表 来学习更多的内容。

.src, .watch, .dest, CLI 参数 - 我该怎么去用这些东西呢?

要了解 API 规范文档,请查看 API 文档.

可用的插件

gulp 开发社区正在快速成长,每天都会有新的插件诞生。在 主站 上可以查看完整的列表。

二:

   秘籍https://www.gulpjs.com.cn/docs/recipes/

文章列表:https://www.gulpjs.com.cn/docs/#articles/

API 文档https://www.gulpjs.com.cn/docs/api/

可用插件的主站https://gulpjs.com/plugins/

原文地址:https://www.cnblogs.com/chenhongshuang/p/8672018.html

时间: 2024-10-10 05:57:01

【Gulp自动化构建工具】的相关文章

gulp自动化构建工具的使用

gulp自动化构建工具: 把前端开发常见的处理(“搬砖”)程序,通过一个工具模块管理起来,只需配置一次,达到自动处理目的,简化开发,提高效率!! 安装: 1.全局安装(全局安装一个gulp命令) A.下载安装: cnpm:cnpm i gulp -g 如果cnpm安装有问题:可使用yarn安装 yarn:   yarn global add gulp B.测试 gulp -v  2.本地安装(引入依赖模块,支持不同版本的项目运行) A.安装 a.创建一个新文件夹,初始化package.json

gulp自动化构建工具

gulp    自动化构建工具,实时监控.代码合并.压缩... http://www.gulpjs.com.cn/     中文网 http://gulpjs.com/plugins/     英文网 ,插件   本文假设你之前没有用过任何任务脚本(task runner)和命令行工具,一步步教你上手Gulp.不要怕,它其实很简单,我会分为五步向你介绍gulp并帮助你完成一些惊人的事情.那就直接开始吧. 第一步:安装Node 首先,最基本也最重要的是,我们需要搭建node环境.访问 http:/

做一个合格的前端,gulp自动化构建工具入门教程

我的新作观点网http://www.guandn.com (观点网是一个猎获新奇.收获知识.重在独立思考的网站),它前端js.css的压缩.合并.md5命名等就使用了gulp自动化构建技术,gulp很小巧使用起来很舒服.ps:接下来我会逐一开源观点网开发过程中的前后端技术,如:lucene全文索引.自定义富文本编辑器.图片上传压缩水印等等. 一.什么是gulp gulp是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务.例如:css.js的合并与压缩(减少http请求,缩小文

Gulp(自动化构建工具 )

前言 Gulp,简而言之,就是前端自动化开发工具,利用它,我们可以提高开发效率. 比如: 1.  压缩js 2.  压缩css 3.  压缩less 4.  压缩图片 等等… 我们完全可以利用Gulp来自动化地完成这些重复性很强的工作. Gulp可以帮助我们 用自动化构建工具增强你的工作流程! 好了,废话不多说了.既然要了解Gulp,就得先安装它.Gulp是基于node来实现的,so你得先有个node环境 优势: node环境有了后,安装Gulp就很easy咯 入门指南 1. 全局安装 gulp

gulp自动化构建工具使用总结

简介: gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快的编写代码,而且大大提高我们的工作效率. gulp是基于Nodejs的自动任务运行器, 她能自动化地完成 javascript/coffee/sass/less/html/image/css 等文件的的测试.检查.合并.压缩.格式化.浏览器自动刷新.部署文件生成,并监听文件在改动后重复指定的这些步骤.在实现上

整理gulp自动化构建工具

教程地址:http://www.dtao.org/archives/18     http://segmentfault.com/a/1190000000372547     http://www.w2bc.com/Article/12941 1.安装nodejs 2.新建package.json文件 3.全局和本地安装gulp 4.使用npm安装gulp插件(如:gulp-jshint.gulp-sass.gulp-mini-css.gulp-uglify等) 5.新建gulpfile.js文

gulp自动化构建工具下的swig、babel、sass

1.三个需要在npm中找相应的教程 gulp-scss.gulp-swig.gulp-babel 2.具体的相关代码如下 var gulp = require('gulp'); var swig = require('gulp-swig'); var babel = require('gulp-babel'); var scss = require("gulp-scss"); gulp.task("scss", function () { gulp.src( &qu

gulp自动化构建工具使用

gulpfile.js: var gulp = require("gulp"); var imagemin = require("gulp-imagemin");//压缩图片插件 var uglify = require("gulp-uglify"); //js压缩插件 var sass = require("gulp-sass"); //sass转换为css插件 var concat = require("gulp

web 环境搭建00前端自动化构建工具(gulp)

web 环境搭建----前端自动化构建工具(gulp): 1----先下载安装node.js 2----然后在node.js命令行安装:npm install gulp -g (全局下载安装gulp插件) 3----然后进入到项目文件夹(命令cd 文件夹名),在项目文件夹中安装依赖文件:npm install gulp --save-dev (根据依赖文件下载gulp插件) 4----在项目文件夹目录下初始化:npm init (初始化文件) {初始化文件后项目中会出现packgae.json文