Gulp的安装和配置

时间:2022-04-30 02:18:20

注意:要安装俩次gulp(全局和本地):全局安装gulp是为了执行gulp任务,本地安装gulp则是为了调用gulp插件的功能。

之前由大牛帮忙配置的gulp来用。今天时间充裕,就和小伙伴一起动手配置gulp及其插件。

前提:已安装nodejs——npm


第一步:建了一个Gulp文件夹,保存插件用于使用
第二步:进入nodejs环境下安装cnpm淘宝镜像文件(若npm install 时报错,形如 npm ERR!Windows_NT XXX ,则将之前存在的.npmrc删掉再安装该镜像文件)

             npm install -g cnpm --registry=https://registry.npm.taobao.org

             (以上解决后)
第三步:配置环境变量,安装npm

            ①环境变量的配置(    PATH量以   ;    往后添加    ):             NODE_PATH项:C:\Users\Administrator\AppData\Roaming\npm\node_modules             PATH项:C:\Users\Administrator\AppData\Roaming\npm;C:\Users\Administrator\AppData\Local\atom\bin Gulp的安装和配置Gulp的安装和配置     第四步:开始安装gulp      (查看gulp是否安装成功:gulp-v)              ①安装全局gulp          cnpm install gulp -g                        ②安装本地gulp                       进入项目文件gulp中输入命令:                                  cnpm install --save-dev              (生成node-modules、package.json等配置文件)                                  cnpm install gulp  --save-dev       (生成gulpfile.js)              安装成功显示Gulp的安装和配置               <另:                 npm install (能自动生成package.json配置文件)                 cnpm init    (手动配置package.json)             >   第五步:在项目文件gulp中安装依赖插件如:   gulp-px2rem-plugin           /gulp-uglify     等               安装命令如下:npm install gulp-px2rem-plugin --save-dev                                       cnpm install gulp-uglify --save-dev                                       等              调用(gulpfile.js中):                                    var gulp = require('gulp');                                    var px2rem = require('gulp-px2rem-plugin');                                   //配合其他插件使用 如:                                    var minifycss = require('gulp-minify-css');     //压缩 css 等     更详细的资料参照:http://www.ydcss.com/archives/18  系列 (包含nodej,npm,gulp安装以及多种方法)