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. 详述Linux配置静态IP、设置DNS和主机名(一)

    Linux配置静态IP.设置DNS和主机名首先要找到配置文件,这是在Linux系统下进行工作的必须知道工作方式.后面一步步的跟着这个范例来进行配置相信你最终也会完成Linux配置静态IP.设置DNS和 ...

  2. 画弧线DrawArc的研究-我自己 -- 直线交接圆角

    procedure TForm4.Button7Click(Sender: TObject); var pwith: Integer; //画笔的宽度 hx1, hy1: Integer; //横线第 ...

  3. HDU 3342 Legal or Not(拓扑排序判断成环)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=3342 题目大意:n个点,m条有向边,让你判断是否有环. 解题思路:裸题,用dfs版的拓扑排序直接套用即 ...

  4. python基础(6)---set、collections介绍

    1.set(集合) set和dict类似,也是一组key的集合,但不存储value.由于key不能重复,所以,在set中,没有重复的key. 集合和我们数学中集合的概念是一样的,也有交集.并集.差集. ...

  5. 小甲鱼Python笔记(上)

    基于Python 3.4.3 一 二 三 四  基础 print 三版必须加括号,二版不用加 alt + n :上一条语句 alt + p :下一条语句 打印三条hello 没有大括号,用缩进来表示 ...

  6. 基于vue2.0的后管系统(配置篇)

    一些项目依赖package.json { "name": "frontend", "description": "tssp bas ...

  7. 更换 ECharts 散点图图标(散点图中symbol的使用)

    更换 ECharts 散点图图标 使用symbol关键字

  8. 湖南大学ACM程序设计新生杯大赛(同步赛)C - Do you like Banana ?

    题目描述 Two endpoints of two line segments on a plane are given to determine whether the two segments a ...

  9. HDU 6185 Covering

    矩阵快速幂. 一开始的思路是$dfs$出一个矩阵,$k[i][j]$表示这一行是状态$i$,将这一行填满,下一行是$j$状态的方案数.然后就可以矩阵快速幂了,但是矩阵大小是$16*16$的,超时了.. ...

  10. 洛谷P4768 [NOI2018]归程 [可持久化并查集,Dijkstra]

    题目传送门 归程 格式难调,题面就不放了. 分析: 之前同步赛的时候反正就一脸懵逼,然后场场暴力大战,现在呢,还是不会$Kruskal$重构树,于是就拿可持久化并查集做. 但是之前做可持久化并查集的时 ...