Gulp教程

Gulp 基础知识

在本章中,您将了解与 Gulp 相关的一些基础知识。

什么是构建系统?

构建系统被称为任务集合(统称为 任务运行器),可自动执行重复性工作。
以下是可以使用构建系统处理的一些任务的列表-
编译预处理 CSS 和 JavaScript。 缩小文件以减小其大小。 将文件合并为一个。 触发服务器自动重新加载。 创建部署版本以将生成的文件存储在一个位置。
在现代前端工作流程中,构建系统使用 3 个组件-
包管理器 预处理器 任务运行器和构建工具

包管理器

用于自动安装升级、移除所需的依赖项、清理库和开发环境中使用的包。包管理器的示例是 bowernpm

预处理器

预处理器通过添加优化的语法和编译成其母语的附加功能,对于高效的现代工作流程非常有用。
一些流行的预处理器是-
CSS-SASS、LESS 和 Stylus。 JS-CoffeeScript、LiveScript、TypeScript 等 HTML-Markdown、HAML、Slim、Jade 等

任务运行器

任务运行器自动执行诸如 SASS 到 CSS 转换、缩小文件、优化图像以及开发工作流程中使用的许多其他任务等任务。 Gulp 是现代前端工作环境中的任务运行器之一,它在 Node 上运行。

设置您的项目

要在您的计算机中设置您的项目,例如创建一个名为"work"的文件夹。工作文件夹包含以下子文件夹和文件-
Src-预处理 HTML 源文件和文件夹的位置。 图像-包含未压缩的图像。 Scripts-包含多个预处理的脚本文件。 Styles-包含多个预处理的 CSS 文件。 Build-此文件夹将自动创建,其中包含生产文件。 图像-包含压缩图像。 Scripts-包含缩小代码的单个脚本文件。 Styles-包含缩小代码的单个 CSS 文件。 gulpfile.js-它是配置文件,用于定义我们的任务。
昵称: 邮箱:
Copyright © 2022 立地货 All Rights Reserved.
备案号:京ICP备14037608号-4