`

【gulp】学习

阅读更多


简介:gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器。她是基于Nodejs的自动任务运行器, 她能自动化地完成 javascript/coffee/sass/less/html/image/css 等文件的的测试、检查、合并、压缩、格式化、浏览器自动刷新、部署文件生成,并监听文件在改动后重复指定的这些步骤。
全局安装
#:npm install --global gulp
项目安装
#:npm install --save-dev gulp
------------------------gulp常用地址----------------------------------------------------------------------------
gulp官方网址:http://gulpjs.com
gulp插件地址:http://gulpjs.com/plugins
gulp 官方API:https://github.com/gulpjs/gulp/blob/master/docs/API.md
gulp 中文API:http://www.ydcss.com/archives/424
------------------------插件-----------------------------------------------------------------------------------------
gulp-concat :多个文件合并成一个
gulp-connect :连接服务器
gulp-rev :gulp自动添加版本号
gulp-minify-css:压缩css文件
gulp-uglify:压缩js
gulp-imagemin:压缩图片文件
gulp-htmlmin:压缩html,可以压缩页面javascript、css,去除页面空格、注释,删除多余属性等操作
gulp-less:less编译
less-plugin-autoprefix:自动加上 css3 前缀
less-plugin-clean-css:压缩 css
-------gulpfile.js文件---------
前端构建工具gulpjs的使用介绍及技巧
-------应用---------------------
Gulp简介及一些常用插件介绍
gulp下静态资源的合并、压缩、MD5后缀
使用Gulp来实现Laravel4的Assets管理
----------------------工具--------------------------------------------------------------------------------------------
browser-sync 执行gulp browser-sync后会监听匹配文件的变化


--------------构建-----------------------------------------------
https://github.com/gulpjs/gulp


教你使用 gulp实现前端自动化介绍+实例

使用gulp构建nodejs,你只需要记住5个函数

Gulp使用指南

Angular项目构建指南 - 不再为angular构建而犹豫不决













 

分享到:
评论

相关推荐

    gulp学习笔记代码.rar

    gulp是JavaScript社区中的一款流行的任务自动化工具,它简化了Web开发过程中的编译、压缩、合并、自动刷新等任务。...在`gulp学习笔记代码`中,你将找到更详细的示例和实践案例,帮助你进一步掌握gulp的使用。

    gulp学习笔记

    本学习笔记将深入探讨Gulp的核心概念、安装与配置,以及常见插件的使用方法。 首先,Gulp的安装是通过npm(Node.js的包管理器)完成的。在命令行中,进入项目目录并执行`npm init`初始化package.json文件,然后运行...

    gulp学习脑图

    整理出来的一个gulp学习脑图,帮助大家全面的学习gulp使用技巧,当然你也可以去看官方文档。

    gulp-learn-demo:gulp学习演示

    【gulp-learn-demo: gulp学习演示】 `gulp`是一个基于流的自动化构建工具,它在JavaScript社区中广泛用于构建前端项目。这个`gulp-learn-demo`项目是一个专门为初学者设计的教程,帮助开发者理解并掌握`gulp`的基本...

    workflows:用gulp学习工作流程

    总结来说,通过学习和实践【workflows:用gulp学习工作流程】,开发者可以掌握如何使用gulp建立高效、灵活的前端工作流程,提升开发效率,确保代码质量和一致性。理解并应用这些知识,将对你的前端开发事业产生积极的...

    gulp-learn:gulp学习

    gulp-learn npm i 安装 crx安装实现livereload gulp w

    gulp配置 gulp配置

    gulp配置 gulp配置

    Gulp:使用Gulp学习基础知识和自动化

    使用Gulp.js框架学习流和自动化的基础知识 安装 在系统CLI中执行以下命令 npm install -g gulp npm install --save gulp 用法 在gulpfile目录中执行这些命令 # Executing '<task>' gulp # Will execute task '...

    gulp教程简单介绍

    ### Gulp教程简单介绍 #### Gulp概述 Gulp 是一个基于 Node.js 的自动化...以上就是 Gulp 的基本使用方法及相关插件的介绍,通过这些基础知识的学习,可以帮助开发者更好地进行前端资源的管理和构建,提高开发效率。

    Gulp自动化工具

    一、什么是gulp,为什么要使用它 1.1自动化 - gulp是一个工具包,可帮助您在开发工作流程中自动执行痛苦或耗时的任务。 1.2与平台无关 - 集成内置于所有...1.4简单 - 通过仅提供最小的API表面,gulp易于学习且易于使用

    gulp-Getting Started with Gulp – Second Edition

    通过阅读本书,读者能够学习到如何设置和运行Gulp自动化工作流,从而在诸如CSS预处理器的编译、JavaScript的压缩和合并、图像优化、自动刷新浏览器、单元测试和代码质量检查等开发环节中,减少重复性工作,提升开发...

    nodejs_gulp_cli

    描述中提到“一键创建基于 gulp 构建工程”,意味着我们将学习如何通过命令行接口 (CLI) 快速设置和管理项目。Gulp CLI 是 Gulp 的命令行工具,使得初学者和经验丰富的开发者都能够方便地初始化、运行任务和管理依赖...

    gulp的基础操作详解

    **gulp的基础操作详解** 在现代前端开发环境中,自动化构建工具起着至关重要的作用,它们能够极大地提高工作效率,减少手动重复劳动。...在实践中不断学习和优化,你将能充分利用 `gulp` 的潜力,提升开发效率。

    gulp4.0.2 前端构建脚手架

    **gulp4.0.2 前端构建脚手架** `gulp` 是一个流行的JavaScript任务运行器,用于自动化前端开发过程,如编译Sass、压缩JavaScript、合并CSS、图像优化等。版本4.0.2是其一个重要版本,带来了更稳定和高效的性能。在...

    Gulp Succinctly

    《Gulp Succinctly》是一本专为学习Gulp和Node.js技术而编写的实用书籍。本书由Kris van der Mast撰写,Daniel Jebaraj作序,并由Syncfusion, Inc.出版。这本书详细介绍了Gulp的基本概念、流的处理方式以及如何使用...

    gulp3.9.1 前端构建脚手架

    学习与实践 - **官方文档**: 访问gulp的官方网站(https://gulpjs.com/)获取最新的文档和教程。 - **在线教程**: 在线平台如Codecademy、freeCodeCamp等提供gulp的课程,帮助你更深入地理解和使用gulp。 - **...

    基于gulp打包的vue单页

    开发者可能会学习如何通过Gulp实现热更新、错误处理和代码质量检查。 综上所述,这个项目涉及到了Vue.js的基础和进阶应用,以及使用Gulp进行前端构建的相关技术。通过学习和实践这个项目,开发者可以提升在Vue.js和...

    基于Gulp的前端自动化.pdf

    gulp.js 是一种基于流的,代码优于配置的新一代构建工具。 Gulp 和 Grunt 类似。但相比于 Grunt 的频繁的 IO 操作,Gulp 的流操作... 易于学习 通过最少的API,掌握Gulp毫不费力,构建工作尽在掌握:如同一系列流管道。

    gulp打包及发布静态资源流程

    `gulp-package-hugin-demo-master`项目就是一个很好的学习案例,通过阅读和实践,你可以更好地掌握`gulp`的工作原理和使用方法。在实际项目中,根据需求灵活配置和扩展`gulp`任务,可以极大地提高开发效率和代码质量...

    gulp 前端开发demo

    通过这个`gulp 前端开发demo`,我们可以学习到如何使用`gulp`进行前端构建。首先,配置`gulpfile.js`以定义项目任务;然后,利用`package.json`管理项目依赖;最后,将源文件放在`src`目录下,通过`gulp`任务进行...

Global site tag (gtag.js) - Google Analytics