zoukankan      html  css  js  c++  java
  • windows下零基础gulp构建

    在学习前,先谈谈大致使用gulp的步骤,给读者以初步的认识。首先当然是安装nodejs,通过nodejs的npm全局安装和项目安装gulp,其次在项目里安装所需要的gulp插件,然后新建gulp的配置文件gulpfile.js并写好配置信息(定义gulp任务),最后通过命令提示符运行gulp任务即可。

    安装nodejs -> 全局安装gulp -> 项目安装gulp以及gulp插件 -> 配置gulpfile.js -> 运行任务

    1、安装nodejs  

    gulp是基于nodejs,理所当然需要安装nodejs

    2、使用命令行

    简单介绍gulp在使用过程中常用命令,打开命令提示符执行下列命令(打开方式:window + r 输入cmd回车):

    node -v查看安装的nodejs版本,出现版本号,说明刚刚已正确安装nodejs。PS:未能出现版本号,请尝试注销电脑重试;

    npm -v查看npm的版本号,npm是在安装nodejs时一同安装的nodejs包管理器,

    cd定位到目录,用法:cd + 路径 ;

    dir列出文件列表;

    cls清空命令提示符窗口内容。

    3、npm介绍

    说明:npm(node package manager)nodejs的包管理器,用于node插件管理(包括安装、卸载、管理依赖等);

    使用npm安装插件:命令提示符执行npm install <name> [-g] [--save-dev]

    <name>:node插件名称。例:npm install gulp-less --save-dev

    -g:全局安装。将会安装在C:UsersAdministratorAppDataRoaming pm,并且写入系统环境变量;  非全局安装:将会安装在当前定位目录;  全局安装可以通过命令行在任何地方调用它,本地安装将安装在定位目录的node_modules文件夹下,通过require()调用;

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

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

    为什么要保存至package.json?因为node插件包相对来说非常庞大,所以不加入版本管理,将配置信息写入package.json并将其加入版本管理,其他开发者对应下载即可(命令提示符执行npm install,则会根据package.json下载所有需要的包,npm install --production只下载dependencies节点的包)。

    4、选装cnpm

    官方网址:http://npm.taobao.org

    安装:命令提示符执行npm install cnpm -g --registry=https://registry.npm.taobao.org;  注意:安装完后最好查看其版本号cnpm -v或关闭命令提示符重新打开,安装完直接使用有可能会出现错误;

    注:cnpm跟npm用法完全一致,只是在执行命令时将npm改为cnpm(以下操作将以cnpm代替npm)。

    5、全局安装gulp

    说明:全局安装gulp目的是为了通过她执行gulp任务;

    安装:命令提示符执行cnpm install gulp -g

    查看是否正确安装:命令提示符执行gulp -v,出现版本号即为正确安装。

    6、新建package.json文件

    说明:package.json是基于nodejs项目必不可少的配置文件,它是存放在项目根目录的普通json文件;

    命令提示符执行cnpm init   直接安装

    7、本地安装gulp插件

    安装:定位目录命令后提示符执行cnpm install --save-dev

    9、运行gulp

    命令提示符执行gulp 任务名称

     

  • 相关阅读:
    27. Remove Element
    26. Remove Duplicates from Sorted Array
    643. Maximum Average Subarray I
    674. Longest Continuous Increasing Subsequence
    1. Two Sum
    217. Contains Duplicate
    448. Find All Numbers Disappeared in an Array
    566. Reshape the Matrix
    628. Maximum Product of Three Numbers
    UVa 1349 Optimal Bus Route Design (最佳完美匹配)
  • 原文地址:https://www.cnblogs.com/DivHao/p/6737283.html
Copyright © 2011-2022 走看看