gulp下安装postcss-px2rem插件

px2rem可以自动的把你的css代码px单位转换成rem单位，可以实现边编辑边转换，在开发手机网站是可以很 高效率的工作，同时也存在一些弊端。就是你在浏览器里调试px单位时，不太方便，，总之利大于弊。

第一步：

  你的电脑必须已经安装node.js,没有安装node的可以去node官网(https://nodejs.org/en/)下载并安装；

第二步：

1. 全局安装gulp环境；命令行输入以下代码：
命令行输入( npm  install gulp -g ) 全局安装gulp；

2. 全局安装完成之后，需要进入到具体的项目根目录里再安装一次；
命令行输入( npm  install gulp ) 项目安装gulp；

第三步：

1. 安装postcss, 命令行输入 

Paste_Image.png

2. 安装成功会显示如下图：

Paste_Image.png

3. 项目node_modules文件夹里会出现，下图文件：

Paste_Image.png

;

第四步：

1. 配置gulpfile.js文件

JavaScript

//导入工具包 require('node_modules里对应模块')
var gulp = require('gulp'), //本地安装gulp所用到的地方
less = require('gulp-less');

//定义一个testLess任务（自定义任务名称）
gulp.task('testLess', function () {
    gulp.src('src/less/index.less') //该任务针对的文件
        .pipe(less()) //该任务调用的模块
        .pipe(gulp.dest('src/css')); //将会在src/css下生成index.css
});

gulp.task('default',['testLess', 'elseTask']); //定义默认任务

//gulp.task(name[, deps], fn) 定义任务  name：任务名称 deps：依赖任务名称 fn：回调函数
//gulp.src(globs[, options]) 执行任务处理的文件  globs：处理的文件路径(字符串或者字符串数组) 
//gulp.dest(path[, options]) 处理完后文件生成路径

第五步：

运行命令 gulp（默认任务名：default） 或 gulp 任务名

通过package.json文件安装插件，先配置package.json文件，命令行输入npm install，就可以安装 package.json里的插件了。。
想通过命令行写package.json文件，输入npm install -save-dev gulp-postcss，就可以实现安装插件的同时，把插件同时写进package.json文件，多人同时开发是，一个人配置好之后，发个别人package.json文件，直接安装就可以用，很方便快捷，又避免多人各自安装出现各种问题。