ld-img-lazy

注意：

1.使用该插件默认已经安装了node以及npm(一般安装node就会自动安装好了)

第一步：全局安装 npm-scaff以及gulp4.0

npm install github:gulpjs/gulp#4.0 -g //一定要用gulp4.0，要不后续会报错
npm install npm-scaff -g    //mac如果报错尝试在开始添加sudo

第二步：验证是否安装成功

pm -V 或者 pm --version //出现版本号说明安装成功

第三步： 创建一个文件夹，进入该文件夹开始创建项目环境模版

mkdir <test>  //创建一个名字为test的文件夹
cd <test>     //进入test这个文件夹
pm init       // 创建脚手架的一些文件，按照提示输入项目名称（假设为jquery)，以及是否自动npm install,以及选用的框架 

第四步：执行完第三步，会在test文件夹下面生成一个jquery的文件夹，然后进入jquery这个项目，通过pm add xx (xx为页面名称)生成页面(之后如果还要创建页面只需要在当前目录下再次执行pm add xx)

cd <jquery> //进入jquery这个文件夹
pm add <pagename> //pagename为你要创建的页面名称，输入之后会在src下面生成页面需要的文件,这里已经做了判断,之前选择什么框架，这里就会生成什么框架的页面模版

目录解构(以jquery框架为例子)

热加载以及打包

• 在package.json这个目录执行以下命令

• • 热加载:gulp demo会自动在浏览器上启动相应的页面，之后改动demo里面的index.html,index.scss,index.js 页面都会自动更新，
• • 打包:gulp build-demo,执行完成这个命令会自动生成一个build的文件，里面为该页面最终压缩过的html、css、js

命令解析

命令	含义
gulp	调试所有页面
gulp demo	调试demo这个页面
gulp build	打包所有页面
gulp build-demo	打包demo这个页面