我爱工程化 之 gulp 使用(一)】的更多相关文章

上一篇  介绍了gulp的安装.环境等配置.基本使用,那么现在,我们快走进 速8,深入了解吧...... 一.各种安装.环境配置.插件安装(参考上一篇文章) 二.项目基本目录结构 三.编写 gulpfile.js 文件 gulp通过gulpfile.js文件来完成相关任务 示例目录 gulpfile.js //引入gulp及组件 var gulp = require('gulp'), //基础库 htmlmin = require('gulp-htmlmin'), //压缩html rev =…
一.简介 gulp是前端自动化工具,压缩.合并.预编译检查等等,它与grunt频繁IO操作来消耗内存相比,它是使用的流的方式,我们可以简称为管道流(一端入,一端出,3通水,一个大桶,第一通在管道里面流吧,那边大桶接着,第一桶流完,第二桶水马上接上,直至三桶水全流完) 功能: 1.图片(压缩图片支持jpg.png.gif) 2.样式 (支持sass 同时支持合并.压缩.重命名) 3.javascript (检查.合并.压缩.重命名)           4.html (压缩)           …
编辑器: VSCode HBuilder WebStorm NotePad++ Eclipse Atom 常用插件: SwitchyOmega Vue-Tools server类: tomcat Nginx IIS服务 http-server XAMPP工具 文档类软件: Beyond Compare XMind 截屏类: FastStone Capture 调试类工具: Fiddler debugger vue-tools 代码管理: git svn TortoiseGit(小乌龟) 连接后台…
vue—你必须知道的   目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript 经验总结 更多总结 猛戳这里 属性与方法 不要在实例属性或者回调函数中(例如,vm.$watch('a', newVal => this.myMethod())使用箭头函数.因为箭头函数会绑定父级上下文,所以 this 不会按照预期指向 Vue 实例,然后 this.myMethod 将是未定义.…
本文样例代码 :https://github.com/demohi/learning-gulp 本文主要简单介绍一下基于gulp和webpack的前端工程化. 技术栈 React.js reFlux Node.js 我们的需求 基于CommonJS模块化开发 基于React.js的组件化开发(JSX) 为保证组件的复用,css需要打包到js中 有国际化需求,静态文件需要部署在CDN上面 工程化工具的选择 gulp(基于stream的构建工具,与grunt相比,速度快且可编程) webpack(前…
gulp npm install -g gulp-concat 文件打包 npm install -g gulp-rename 文件重命名 npm install -g gulp-imagemin 图片压缩 npm install -g gulp-jslint js代码校验 慎用 npm install -g gulp-minify-css css压缩 npm install -g gulp-minify-html html压缩 npm install -g gulp-uglify js压缩 它…
gulpfile.js var gulp = require('gulp'); var rename = require('gulp-rename') var pump = require('pump'); var connect = require('gulp-connect'); //ftl转html gulp.task('ftl-html',function(cb){ pump([ gulp.src('WEB-INF/page/Wechat/*.ftl'), rename({extname…
gulp是什么 gulp就是一个前端的自动化构建工具,在开发过程中很多重复的任务可以使用gulp和gulp插件自动完成.相比于grunt,gulp非常好上手,核心API只有4个,而且还有丰富的插件库. gulp快速入门 全局安装gulpnpm install -g gulp 初始化项目,在项目目录下npm init -y 作为项目的开发依赖(devDependencies)安装npm install --save-dev gulp 在项目根目录下创建一个名为gulpfile.js的文件,并写入如…
Gulp是什么? Gulp是前端自动化的工具,但Gulp能用来做什么 1.搭建web服务器 2.使用预处理器Sass,Less 3.压缩优化,可以压缩JS CSS Html 图片 4.自动将更新变化的代码实时显示在浏览器 5.前端测试 ...... 这些都不是他的全部功能,社区丰富的插件,为他提供了强大的后盾. 首先下载gulp(前提默认你安装好了node,先 npm install,创建一个package.json) npm install gulp -g //全局安装 npm install…
修改增加了demo地址 gulp-webpack-demo 之前在使用gulp和webpack对项目进行构建的时候遇到了一些问题,最终算是搭建了一套比较完整的解决方案,接下来这篇文章以一个实际项目为例子,讲解多页面项目中如何利用gulp和webpack进行工程化构建.本文是自己的实践经验,所以有些解决方案并不是最优的,仍在探索优化中.所以有什么错误疏漏请随时指出. 使用gulp过程中的一些问题,我已经在另外一篇文章讲到了 grunt or gulp 前言 现在为什么又整了一个webpack进来呢…