gulp 必备功能及插件及前端环境说明
2018-05-20 本文已影响0人
前端_周瑾
| 功能 | 插件 |
|---|---|
| 无需require每个插件(可选） | gulp-load-plugins |
| 页面压缩 | gulp-htmlmin |
| sass编译 | gulp-sass |
| css前缀添加 | gulp-autoprefixer |
| css压缩 | gulp-minfiy-css |
| 图片压缩 | gulp-imagemin |
| js语法检测 | gulp-jshint |
| js 压缩 | gulp-uglify |
| 文件合并 | gulp-concat |
| HTML自动替换路径 | gulp-html-replace |
| 服务器 | gulp-webserver |
| js 模块化 | browserify/webpack |
| 解决缓存问题 | gulp-rev/gulp-rev-collector |
| 缓存文件 | gulp-cache |
| 文件压缩后重命名 | vinyl-source-stream/viny |
| 去掉console.log() | gulp-strip-debug |
| 根据用户在小黑窗输入不同的命令，执行不同的打包任务； | yargs/envify/custom |
| 不限以上功能 | 插件更新迭代速度极快，可能会有心得不限以上插件 |
前端开发环境与生产环境
前端的开发环境与部署环境应该是由差异的，这是因为开发便利与程序最后有意的性能追求会有一些冲突的地方
开发环境
前端的开发越来越体现工程化改革的姿态，无论是工具的进化还是框架的更新迭代，前端是对性能的狂热追求者，工程化的不断进步，必然导致的就是开发环境的多姿多态，各种工具，各种插件，各种方案，而不可避免的是前端开发时开发环境显得臃肿
生产环境
生产环境的真实环境，是显示用户直接接触的产品环境，其性能级别是最终的，直接影响用户的体验感，所以，生产环境要考虑性能，所以，开发环境不能直接应用为生产环境，我们需要对环境可优化的部分进行优化
这里举2个例子
缓存
利用版本管理等手段合理选择利用资源缓存和更新来优化生产环境的加载性能
动态选择加载
我们运行
