1.创建:gulpfile.js

var gulp = require('gulp'),
less = require('gulp-less'); gulp.task('default', function () {
gulp.src('less/index.less')
.pipe(less())
.pipe(gulp.dest('dist'));
});

2.创建package.json

npm init

3.安装gulp到项目

npm install --save-dev gulp

4.安装插件到项目:

npm install gulp-less --save-dev

5.准备的less/index.css

@color:#ff0000;
body{color:@color;}

6.目录下运行:

gulp

效果输出:

dist/app.css

body {
color: #ff0000;
}

Gulp插件less的使用的更多相关文章

  1. 常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案(三)

    前两篇文章讨论了 Gulp 的安装部署及基本概念,借助于 Gulp 强大的 插件生态 可以完成很多常见的和不常见的任务.本文主要汇总常用的 Gulp 插件及其基本使用,需要读者对 Gulp 有一个基本 ...

  2. gulp 插件

    原文链接:http://www.mamicode.com/info-detail-517085.html gulp是什么? http://gulpjs.com/ 相信你会明白的! 与著名的构建工具gr ...

  3. gulp插件(gulp-jmbuild),用于WEB前端构建

    源码地址:https://github.com/jiamao/gulp-jmbuild https://github.com/jiamao/gulp-jmbuild gulp-jmbuild gulp ...

  4. gulp插件gulp-usemin简单使用

    关于什么是gulp,它和grunt有什么区别等问题,这里不做任何介绍.本文主要介绍如何使用gulp-usemin这款插件,同时也会简单介绍本文中用到的一些插件. 什么是gulp-usemin 用来将H ...

  5. 使用gulp插件来自动刷新页面。

    http://itakeo.com/blog/2016/05/19/gulpreload/?none=123 使用gulp插件来自动刷新页面.再也不用修改一次,按一下F5了. 首选通过npm inst ...

  6. 将less编译成css的gulp插件

    简介:gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快的编写代码, ...

  7. 如何编写一个gulp插件

    很久以前,我们在"细说gulp"随笔中,以压缩JavaScript为例,详细地讲解了如何利用gulp来完成前端自动化. 再来短暂回顾下,当时除了借助gulp之外,我们还利用了第三方 ...

  8. Gulp 插件及其使用

    前端现在有很多的自动打包工具,各有优缺点,而gulp作为其中的一员,也有着很受人们的青睐,简单粗暴,然而gulp本身并没有提供很多的API,真正的一些工作则是靠着插件完成的,本文简单介绍一些常用的gu ...

  9. gulp插件构建项目 压缩js、css、image、zip、web服务、跨域等插件

    推荐一个很好文: https://github.com/lin-xin/blog/issues/2 匹配符 *.**.!.{} gulp.src('./js/*.js') // * 匹配js文件夹下所 ...

  10. Gulp插件笔记

    初次接触Gulp是出于网页模块化的需要,用过之后发现这个任务管理工具有很多实用的插件,意外地好用,于是打算写下这篇笔记把用到的Gulp插件记录一下.至于想了解Gulp基本用法的同学可以去Gulp官网查 ...

随机推荐

  1. EF – 8.多对多关联

    5.6.10 <多对多关联(上)> 时长:9分57秒 难度:难 5.6.11<多对多关联(下)> 时长:8分50秒 难度:难 如果单独地把多对多关联的CRUD拿出来讲,确实比较 ...

  2. GUC-4 CopyOnWriteArrayList/CopyOnWriteArraySet

    /* * CopyOnWriteArrayList/CopyOnWriteArraySet : “写入并复制” * 注意:添加操作多时,效率低,因为每次添加时都会进行复制,开销非常的大.并发迭代操作多 ...

  3. GUC-2 原子性

    import java.util.concurrent.atomic.AtomicInteger; /* * 一.i++ 的原子性问题:i++ 的操作实际上分为三个步骤“读-改-写” * int i ...

  4. c#多线程实现函数同步运行

    我们假设有方法run1()和run2(),耗时都比较大,实现他们同步运行将大大提高程序的效率,在这里考虑使用多线程的方法. 首先添加引用,定义bool型i,j为false. using System. ...

  5. 454. 四数相加 II

    给定四个包含整数的数组列表 A , B , C , D ,计算有多少个元组 (i, j, k, l) ,使得 A[i] + B[j] + C[k] + D[l] = 0. 为了使问题简单化,所有的 A ...

  6. 湖南大学ACM程序设计新生杯大赛(同步赛)A - Array

    题目描述 Given an array A with length n  a[1],a[2],...,a[n] where a[i] (1<=i<=n) is positive integ ...

  7. iOS 9音频应用播放音频之ios9音频基本功能

    iOS 9音频应用播放音频之ios9音频基本功能 在iOS 9音频应用开发中最为简单和常用的就是AVFoundation框架中的AVAudioPlayer类.虽然AVAudioPlayer类不能播放网 ...

  8. PHP 笔记——String 字符串

    1. 定义 单引号括起来的字符串被原样输出. 双引号字符串中的变量被PHP解析为变量值. 2. 获取字符串长度 strlen(string $string): int 在utf-8下,汉字占3个字符, ...

  9. [BZOJ1937][SHOI2004]Mst最小生成树(KM算法,最大费用流)

    1937: [Shoi2004]Mst 最小生成树 Time Limit: 3 Sec  Memory Limit: 64 MBSubmit: 802  Solved: 344[Submit][Sta ...

  10. nginx-404与fastcgi_intercept_errors指令

    nginx-404与fastcgi_intercept_errors指令 fastcgi_intercept_errors语法:fastcgi_intercept_errors on|off 默认值: ...