1.安装node.js

下载地址:http://nodejs.cn/download/

这时我们输入 node -v  以及  npm -v  检查是否安装成功。

2.为了提高后续使用的快速,我们安装一个cnpm。

什么是cnpm?简单的来说就是把国外的npm完全映照在国内

这就是镜像的cnpm。内容会不断的同步npm的内容。

至于怎么安装请跳转:http://blog.csdn.net/qq_38712750/article/details/71750734点击打开链接

3.安装好了之后我们开始进入今天的正题gulp的安装使用;

输入安装命令 cnpm install gulp-g          注意这里的-g 是全局安装

安装好后查看是否安装成功(用查看版本号的方法)输入 gulp -v

然后进入下一步

5.新建package.json文件

在这之前我们先要跳转到想存放的文件目录中

确定跳转成功后接着输入:cnpm init

输入关键内容:

填写完后一定要确认内容

最后确认生成package.json文件

先检查一下,成功生成文件后继续下一步

 

6.安装less:输入cnpm install gulp-less --save-dev  以及cnpm install gulp --save-dev注意这里不是全局安装

--save:将保存配置信息至package.json(package.json是nodejs项目配置文件);

-dev:保存至package.json的devDependencies节点,不指定-dev将保存至dependencies节点;一般保存在dependencies的像这些express/ejs/body-parser等等。

接着检查package.josn文件里是否存在安装的内容(12,13),没有的话要手动添加。

 

7.创建gulpfile.js文件内容如下:(第一次输入最好手打  提高印象)

一定要注意的是图中标记的路径以及文件名是可变的。

特别是less文件名,如果不想那么麻烦就直接用 ‘*’(星号代替) 代替;

然后就完成了一系列安装。

创建less文件后即可使用

 参考地址:https://blog.csdn.net/qq_38712750/article/details/71791043

8.在webstorm中配置sass的自动编译(最新版不用设置)

参考地址:https://jinyanhuan.github.io/2015/04/26/less-in-webstorm/

gulp的安装以及less插件安装与使用的更多相关文章

  1. ElasticSearch安装和head插件安装

    本文主要介绍elasticsearch5.0安装及head插件安装.确保系统已经安装好jdk1.8以上,操作系统CentOS6以上. 一.elasticsearch安装配置 1.官网下载源码包 下载不 ...

  2. 【windows环境下】RabbitMq的安装和监控插件安装

    RabbitMq的安装: RabbitMQ是基于Erlang的,所以必须先配置Erlang环境. 下载Erlang,地址:http://www.erlang.org/download/otp_win3 ...

  3. Android模拟器genymotion安装与eclipse 插件安装

    推荐一款Android模拟器"Genymotion",有点速度快,占用资源少,可整合eclipse.闲话少谈,看安装步骤. 1.下载地址:https://www.genymotio ...

  4. Sublime Text3安装及常用插件安装

    为了使用强大好用的代码编辑器来进行selenium3+Python3的自动化测试. 使用Sublime Text 3非常适合. 1.下载安装 首先到http://www.sublimetext.com ...

  5. VScode安装后的插件安装

    杭州SEO:Chinese(Simplified) Language Pack for Visual Stidio Code 中文汉化包 对于一些英文不太好的小伙伴,上来第一件事肯定是要切换成中文语言 ...

  6. jmeter在Windows下安装(含插件安装)

    [准备环境] jdk1.8 jmeter的安装包下载 [步骤] 1 把下载下来的压缩包解压,点击jmeter.bat 启动,启动后是英文界面 2 修改默认的英文界面,打开jmeter.properti ...

  7. 【linux环境下】RabbitMq的安装和监控插件安装

    [注意安装过程中,提示某些命令not found,直接yum isntall一下就好了] 以下是我在CentOS release 6.4下亲测成功的. RabbitMq的安装:   RabbitMQ是 ...

  8. Sublime Text 3安装及常用插件安装

    一.Sublime3下载 1.百度搜索Sublime3 download,选择进入下载页面 2.我选择下载Win64位安装程序 二.Sublime3安装 傻瓜式安装,一直点下一步即可. 三.Subli ...

  9. 2.Brackets安装及常用插件安装

    转自:https://blog.csdn.net/autumn20080101/article/details/53171326 Brackets 是一个免费.开源且跨平台的 HTML/CSS/Jav ...

随机推荐

  1. jeecms jeecmsv93建库

    create tablespace jeecms93 datafile 'jeecms93.dbf' size 100M reuse autoextend on next 50M;1. 2.drop ...

  2. <随便写>random函数

    import random random,randint(1,100)返回随机数 random.choice(list)从一个列表中随机选取一个元素返回 random.shuffle(list)将列表 ...

  3. visual studio 2017--括号自动补全

    ---恢复内容开始--- 平常在visual studio中编写C++代码,一般括号之类的都是自动补全的,最近想用来编写Python,发现括号不能补全了,很不适应. Python编写时好像括号好像默认 ...

  4. C开发系列-数组

    C语言数组 数组:用来存储一组数据. 计算C语言的数组长度 int age1 = 12; int age2 = 15; int age3 = 10; int age4 = 13; int ages[] ...

  5. loj6094 归乡迷途

    题意:有一张n个点的无向图,点有标号.求满足下列性质的图有多少个. 1.任意节点到1的最短路唯一.2.i的最短路长度<=i+1的最短路长度.3.所有点的度数给定,为2或3. n<=400. ...

  6. 二分图——poj2446匈牙利算法

    /* 怎么建图: 首先分集合:不能相连的点必然在一个集合里,即对角点 再确定怎么连边: 一个点可以向上下左右连边,如果遇到了洞则不行 dfs(i),让匹配到的点接受i作为match结果 寻找增广路时, ...

  7. springboot+mybatis+达梦数据库

    准备工作: 首先,安装达梦6数据库.安装完之后如下建表 然后,很重要的一点(写法一定要这样写,否则无限报错) 达梦数据库查表方式: select  *  from    "库名". ...

  8. work-shineyoo:杂项1906

    ylbtech-work-shineyoo:杂项1906 1.返回顶部 1. 1.1 SMS (手机的)短信服务.Short Message Service. 1.2 VOD 视频点播.Video o ...

  9. IDEA(2018)连接MySQL数据库失败的解决方法(报错08001)

     解决方法: 将url改成: jdbc:mysql://localhost:3306/studentmanage?useSSL=true&serverTimezone=Hongkong& ...

  10. @Value取值为NULL的解决方案

    在spring mvc架构中,如果希望在程序中直接使用properties中定义的配置值,通常使用一下方式来获取: @Value("${tag}") private String ...