Gulp如何编译sass

Gulp 是一个自动化工具，前端开发者可以使用它来处理常见任务：

1、搭建web服务器

2、文件保存时自动重载浏览器

3、使用预处理器如Sass、LESS

4、优化资源，比如压缩CSS、JavaScript、压缩图片

当然Gulp能做的远不止这些。如果你够疯狂，你甚至可以使用它搭建一个静态页面生成器。Gulp真的足够强大，但你必须学会驾驭它。

这是这篇文章的主要目的。帮助你了解Gulp的基础用法，助你早日完成一统天下的大业。

我们将要做的

这篇文章的最后，你会拥有简单的一个工作流：

• 编译Sass

除此之外，你还将学会使用简单命令链式调用多个任务。

安装Gulp

安装完Node.js，使用Terminal(终端，win下是cmd)用下面命令安装Gulp

$ sudo npm install gulp -g

Mac 用户需要管理员权限才能全局安装，所以需要sudo。

接下来使用Gulp创建项目。

创建Gulp项目

首先，我们新建一个project文件夹，并在该目录下执行 npm init 命令：

$ npm init

npm init命令会为你创建一个package.json文件，这个文件保存着这个项目相关信息。比如你用到的各种依赖（这里主要是插件）（终端会自动出现下面内容，这里先随便填就行）

创建完之后，我们执行下面的命令：

$ npm install gulp --save-dev

此时package.json文件会自动更新依赖包！
2、在gulpfile.js内引入该插件

3.告知gulp要执行的任务，gulpfile.js中的task任务

此时命令行执行

             gulp sass

会在dist/css/自动编译生成所有的css

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有