`
LiYunpeng
  • 浏览: 948151 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

gulp常用的plugin描述(陆续更新)

    博客分类:
  • gulp
阅读更多
gulp-concat
用来合并文件的,可以将多个文件进行合并,比如js、css等
使用方法可参看
https://www.npmjs.com/package/gulp-concat

gulp-uglify
用来压缩js文件的工具
相关配置如下
https://github.com/terinjokes/gulp-uglify


gulp-sourcemaps
用来将对应管道中的文件生成.map文件,而.map文件的作用就是让浏览器在对应加载的代码上找到映射的源,比如通过加载的css找到对应的sass
关于.map可以参看
http://www.cnblogs.com/vajoy/p/3992411.html


gulp-autoprefixer
代码兼容性自动补全
https://github.com/postcss/autoprefixer
对于CSS3的代码而言,各家浏览器需要编写的代码不一样,所以还需要各自的编写,webstorm已经提供这一功能,但是并不是所有的都可以自动补全,所以这里面用到了这个,来帮助我们将CSS代码自动补全兼容的代码内容。
比如:
:fullscreen a {
    display: flex
}

补全后就是
:-webkit-full-screen a {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex
}
:-moz-full-screen a {
    display: flex
}
:-ms-fullscreen a {
    display: -ms-flexbox;
    display: flex
}
:fullscreen a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}




gulp-sass
这个不用多说了,看名字就知道,编译sass的,但是这里提出一嘴就是,下载这个不知道为啥总下载失败,然后墙外下载就没问题,墙内的话可能只能下载一半,运行时候才有问题。




browser-sync
用来启动一个web服务,是的可以通过HTTP的方式来调试web页面,也可以在里面进行配置访问代理,总的来讲就是一个通过node编写的web服务
http://www.browsersync.cn/docs/options/
分享到:
评论

相关推荐

    精通gulp常用插件

    【gulp常用插件详解】 在JavaScript开发中,打包工具起着至关重要的作用,它们能够自动化构建过程,提高开发效率。Gulp是其中一个流行的构建工具,以其流式处理和易用性受到开发者们的喜爱。本文将深入探讨Gulp的...

    gulp-plugin-cb:使用 Gulp 插件转换 Vinyl 文件但带有回调接口

    gulp-plugin-cb 使用 Gulp 插件转换 Vinyl 文件,但带有回调接口。 例子 var transform = require ( 'gulp-plugin-cb' ) ; var uglify = require ( 'gulp-uglify' ) ; transform ( file , uglify ( ) , function ...

    gulp编译gulp编译文件、gulp编译项目

    3. **插件(plugin)**:`gulp` 社区提供了大量的插件,用于扩展其功能,如`gulp-sass`(编译Sass)、`gulp-babel`(转译ES6+到ES5)等。这些插件通常是基于Node.js模块,遵循`gulp` 的API规范。 ### 二、gulp的安装...

    gulp的基础操作详解

    **gulp的基础操作详解** 在现代前端开发环境中,自动化构建工具起着至关重要的作用,它们能够极大地提高工作效率,减少手动重复劳动。其中,`gulp` 是一个非常流行的选择,它基于强大的 JavaScript 运行环境 `Node....

    gulp-plugin-boilerplate:启动创建Gulp插件的样板

    gulp-plugin-boilerplate Boilerplate开始创建插件 包含所有当前的最佳实践。 入门 在您的目录中,运行: $ curl -fsSL https://github.com/sindresorhus/gulp-plugin-boilerplate/archive/main.tar.gz | tar -xz ...

    gulp的简单搭建

    现在,当你修改Sass文件时,`gulp`会自动编译并更新CSS。 ### 5. 流程优化 除了基本任务,还可以定义更复杂的流程,比如使用`gulp-clean-css`和`gulp-uglify`压缩CSS和JavaScript。安装插件: ```bash npm ...

    gulp管理版本号

    【gulp管理版本号】是指在开发过程中,使用Gulp自动化构建工具来管理和更新项目的版本号。Gulp是一个基于Node.js的构建系统,它允许开发者通过编写任务来自动化复杂的项目构建流程,包括版本号的管理。 首先,安装*...

    gulp配置 gulp配置

    gulp配置 gulp配置

    generator-gulp-plugin-boilerplate:搭建Gulp插件的样板

    发电机口香糖插件样板 安装 $ npm install --global yo generator-gulp-plugin-boilerplate 用法 用运行它: $ yo gulp-plugin-boilerplate 执照 麻省理工学院:copyright:

    前端开源库-through-gulp

    "前端开源库-through-gulp"项目就是这样的一个工具,旨在利用Node.js的流处理能力,通过一个精巧的小包装器来简化`gulp-plugin`的开发过程。 首先,我们要了解`gulp`。`gulp`是一款基于任务的构建工具,它使用简洁...

    gulp教程简单介绍

    Gulp 提供了两种常用的异常处理方式: 1. **gulp-notify**:用于在错误发生时向系统发送通知。 ```bash npm install --save-dev gulp-notify ``` 在 `gulpfile.js` 中使用: ```javascript const gulp = ...

    nodejs_gulp_cli

    此外,Gulp CLI 提供了一些常用命令,如 `gulp --version` 查看版本,`gulp help` 显示帮助信息,以及 `gulp [taskName]` 执行指定的任务。如果你想要自定义命令,可以通过在 Gulpfile.js 中定义 `exports` 对象来...

    gulpAPI中文文档

    - **插件(Plugin)**:Gulp插件是用于扩展Gulp功能的NPM包,用于实现各种自动化任务。 - **Stream**:Gulp基于Node.js的流模型,可以将文件视为数据流进行处理,这使得文件处理过程更加高效。 #### 实战技巧 - **...

    Gulp, Gulp构建前端自动化工作流(Gulp入门介绍).zip

    3. **插件(plugin)**:Gulp拥有丰富的生态系统,其中包含大量插件,用于执行各种任务,如文件转换、压缩、合并等。每个插件都是一个Node.js模块,遵循Gulp的API规范。 4. **依赖(dependency)**:一个任务可以依赖于...

    gulp自动打包工具

    **gulp自动打包工具** 在现代前端开发中,自动化构建工具起着至关重要的作用,它们能够极大地提高开发效率,简化重复性工作。其中,`gulp`就是一款流行的任务管理器,它允许开发者通过编写简单的JavaScript任务来...

    gulp打包js,min.js,d.ts

    标题 "gulp打包js,min.js,d.ts" 描述的是使用Gulp工具进行JavaScript项目构建的过程,主要涉及将源代码打包成JS、压缩成min.js以及生成d.ts类型定义文件。Gulp是一个基于Node.js的自动化任务运行器,它可以极大提高...

    gulp-plugin-boiler:gulp-plugins 的样板 - 遵循 fractal 的风格

    #GULPPLUGINNAME 用 gulp 编译一些东西信息包裹吞咽插件名称描述描述节点版本>= 0.9 吞咽版4.x用法安装$ npm install --save-dev GULPPLUGINNAME例子 // include the required packages.var gulp = require ( 'gulp'...

    Gulp中英文加空格扩展gulp-pangu.zip

    gulp-pangu 是 Gulp 扩展,可以在中文与英文之间添加空格字符。 var pangu = require('gulp-pangu');安装$ npm install --save-dev gulp-pangu使用// include the required packages.var gulp = ...

    Gulp Succinctly

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

Global site tag (gtag.js) - Google Analytics