gulp-less插件之less文件编译成css
gulp 是基于node的,所以第一步要确保你已经安装了node环境,具体怎么安装可以到node官网去看一下(https://nodejs.org/en/)
1.全局按钮gulp
打开node窗口输入npm install -g gulp
全局安装好之后 进入当前目录安装本地安装
npm install --save-dev gulp
当全局与本地项目文件夹里面都安装好了之间 使用命令行 gulp –v看一下版本
如果版本一样那就最好了
2.插件安装
npm install gulp-less --save-dev
npm install --save-dev gulp-less
npm install --save-dev gulp-watch
安装好插件之后我们在目录里面就会看到文件
3.Gulpfile.js任务配置
var gulp = require('gulp'),
less = require('gulp-less'),
watch = require('gulp-watch'); //编译我们的less
gulp.task('testLess', function () {
gulp.src('less/bootstrap.less')
.pipe(less())
.pipe(gulp.dest('css/'));//输出文件夹--主要这里的路径
}); gulp.task('testWatch', function () {
gulp.watch('less/*.less', ['testLess']); //当所有less文件发生改变时,调用testLess任务
});
配置出来之后
执行gulp testWatch任务进行less监测,当less文件修改了之后对应的css文件就会跟着改变
gulp-less插件之less文件编译成css的更多相关文章
- 用gulp把less文件编译成css文件
第一次使用gulp构建工具,使用gulp将.less文件编译成.css文件并输出.根据视频做了笔记.提供新手和自己以后做参考. HTML文件 <!DOCTYPE html> <htm ...
- 将less编译成css的gulp插件
简介:gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快的编写代码, ...
- 在JAVA中将class文件编译成jar文件包,运行提示没有主清单属性
在JAVA中将class文件编译成jar文件包,运行提示没有主清单属性 Maven 项目生成jar运行时提示“没有主清单属性” 新建了一个Maven的项目,mvn compile和mvn packag ...
- 如何将less编译成css文件__less自动编译成css的方法总结
作为css的预处理less,拥有着比css更快捷方便,扩展了css的变量.Mixin.函数等特性,使 CSS 更易维护和扩展. 如何你已经回使用css,那么less就很容易上手了.如果不使用less ...
- Linux内核驱动将多个C文件编译成一个ko文件的方法——每一个C文件中都有module_init与module_exit
以两个C文件为例: 将本该被分别编译成adc_device.ko和adc_driver.ko的adc_device.c.adc_driver.c编译成一个ko文件! 採用方法: 第一步.改动C文件 1 ...
- C#.NET常见问题(FAQ)-如何将cs文件编译成dll文件 exe文件 如何调用dll文件
比如我要把TestDLL.cs文件编译成dll文件,则在命令提示符下,输入下面的命令,生成的文件为TestDLL.dll csc /target:library TestDLL.cs 注意前提是你安装 ...
- C#.NET如何将cs文件编译成dll文件 exe文件 如何调用dll文件
比如我要把TestDLL.cs文件编译成dll文件,则在命令提示符下,输入下面的命令,生成的文件为TestDLL.dll csc /target:library TestDLL.cs 注意前提是你安装 ...
- Sublime text 3如何编辑less并转(编译)成css文件
今天开始学习使用less这个强大方便的前端工具,本来是考虑用koala(专门编辑less的软件)来使用less的,但是发现sublime编辑器也可以实现对less的编译及高亮显示代码,这样既能少用一个 ...
- less文件编译成微信小程序wxss文件
2016年9月21日,微信小程序正式开启内测.在微信生态下,触手可及.用完即走的微信小程序引起广泛关注,刷爆朋友圈子.在这样的火爆氛围中,作为一个前端开发者的我,也悄悄地去尝鲜.在做demo小示例的过 ...
随机推荐
- 不容易系列之二[HDU2042]
不容易系列之二 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Sub ...
- 命令模式坚决svn树冲突(local unversioned, incoming add upon update)
当工作目录修改删除过时更新使用svn更新就容易发生树冲突“Tree Confilict”.会出现类似提示. local unversioned, incoming add upon update 如果 ...
- POJ 3281 (最大流+匹配+拆点)
题目链接:http://poj.org/problem?id=3281 题目大意:有一些牛,一堆食物,一堆饮料.一头牛要吃一份食物喝一份饮料才算满足,而且牛对某些食物和饮料才有好感,问最多有多少头牛是 ...
- html页面元素加载顺序
一般来说,添加背景图片有三种办法: 直接写在标签的style里面,如: <div style="background-image:url('images/Css.JPG')" ...
- Nhibernate Case SUM
SELECT ID END) as nbRowWithValueOf2, END) as nbRowWithValueOf3 FROM Foo GROUP BY ID queryover = quer ...
- 网页制作常见的问题(怎样兼容IE6/IE7/火狐浏览器)
1.IE6双边距问题? 在IE6的浏览器中明明设置的是10px的margin却为什么显示的是20px的margin其实这个Ie6的一个双边距BUG 例如: <style type="t ...
- C++ and Java template class and function 模板类和模板函数
在C++和Java的泛式编程中,模板template的使用是必不可少的,但是Java中没有template关键字,所以两者的写法还是有些许区别的,请参见如下代码: Java的模板 // Java pu ...
- QInputDialog 使用方法
在Qt中,如果想快速生成一个对话框,可以和用户进行简单的交互,而不需要写一个新的类的时候,就要用到QInputDialog类,这个类就是专门用来建立简单对话框的,其主要能建下列几种对话框:
- AsyncTask的基本使用
// String --> doInBackground(Params... params)的参数 // File --> publishProgress(Progress... valu ...
- journalctl --help
journalctl [OPTIONS...] [MATCHES...] Query the journal. Flags: --system Show the sy ...