gulp使用小结(一)

gulp使用小结(二)

接上篇文章接Gulp使用小结(一) 内容如下: 首先,偶在gulp-demos上已经提交了个较通用的栗子...俺琢磨半天,原准备分阶段搞些 Gulp 套路,但是写完介个栗子之后,觉得已经能覆盖绝大多数的场景了(懵逼脸.gif).算哒,当偶偷懒就酱吧,一个套路打天下:) 然后,聊聊这篇值得思考的文章<我为何放弃Gulp与Grunt,转投npm scripts> 上中下, 英文原地址奉上:<Why I Left Gulp and Grunt for npm Scripts> 最后,…

这篇文章不会介绍 gulp 的起源.发展:不会去一个个讲解 gulp API:也不想出现大段大段的 gulpfile.js 代码:更木有帮你分析 gulp 实现原理,只有一些我自己对 gulp 的使用理解和总结. 如何通过 gulp 让偶们的前端项目高大上的跑起来?gulp 能做什么,还能做什么?gulp套路能不能来几套?... 希望通过这篇文章你会找到答案写作风格的原因,劳资写的文章都较详(啰)细(嗦),请轻拍:) 当然,同样期待能得到伙伴们的讨论和支持. 目录简单介绍必备插件常用插件…

gulp 用法小结

前端们,gulp该用起来了,简单的demo入门 gulp.grunt前端自动化工具,只有用过才知道多么重要. 作者:一文不提来源:博客园|2015-05-28 10:35 移动端收藏分享 gulp.grunt前端自动化工具,只有用过才知道多么重要. 它们问世这么久了?你真的用过吗? 写个简单的less.watch任务的demo分享———— 1.准备: 安装全局node.npm,这个教程很多不作详细介绍: 新建getstart文件夹,文件夹中创建package.json,记得加上{},保存 2…

gulp布局构建小结

一.工具选择CSS预处理语言LESS 构建工具gulp(基于node环境)gulp插件:gulp-connect——主要是用来运行一个webserver npm install --save-dev gulp-connect 插件介绍:https://www.npmjs.com/package/gulp-connect gulp.spritesmith——雪碧图 npm install gulp.spritesmith --save-dev 插件介绍:https://www.npmjs.com/…

介绍一种基于gulp对seajs的模块做合并压缩的方式

之前的项目一直采用grunt来构建,然后用requirejs做模块化,requirejs官方有提供grunt的插件来做压缩合并.现在的项目切到了gulp,模块化用起了seajs,自然而然地也想到了模块合并压缩的问题.然后一开始在解决这个问题的时候,并不是很顺利,在npm上并没有那种特别流行的专门用来做seajs合并压缩的gulp插件,虽然在seajs的github上也看了不少的issue,但是大多数都是只能将所有的模块文件合并成一个总的文件,这对于单页面的应用来说肯定没有问题,但是对于多页面的应…

npm 重点小结

npm作为javascript一个用得比较广的包管理工具,已经集成在了node里面,基本一安装node就可以用npm了,十分方便.这里的小结主要沿着官方文档的思路,挑出一些比较重点的,平时常用的部分进行说明,力求清晰与主次分明. 全局与本地安装本地安装指的是只将包下载到当前项目的node_module文件夹,当安装的包只需要在项目中被require使用时,用本地安装:全局安装指将包下载到本机安装的npm创建的/lib/node_module文件夹,当安装的包需要在控制台打命令行运行时,就需要全…

gulp安装及使用流程

1. 安装nodejs 去 https://nodejs.org/en/下载安装文件安装即可. 安装完成后,在终端输入node -v回车打印出nodejs的版本号,说明nodejs安装成功. 在终端输入npm -v回车打印出npm的版本号,说明npm也安装成功(node安装包中已集成了npm,因此在安装nodejs的同时也安装了npm). 这里推荐用nvm安装.附上链接地址 http://www.cnblogs.com/yesyes/p/7403184.html 2. 设置npm 由于https…

git和gulp使用

git push origin master/chunxiong git remote -v git merge chunxiong working tree:就是你所工作在的目录,每当你在代码中进行了修改,working tree的状态就改变了. index file:是索引文件,它是连接working tree和commit的桥梁,每当我们使用git-add命令来登记后,index file的内容就改变了,此时index file就和working tree同步了.commit:是最后的阶段…

gulp入门实践

前言:大家可能都听说过gulp,知道它是一种前端自动化开发工具,可以用来文件压缩.语法检查.文件合并和编译less等,但可能并不知道要怎么用?看过官方文档,也看过许多博客,但基本都是讲gulp的API和各类插件,一直不太清楚到底应该怎么着手使用gulp.本文就根据我最近对一些了解,从头开始一步步实现对gulp的应用. 你可以提前看一看gulp官方文档了解一下,不了解也没事,在实践过程中遇到了再去查. 全局安装gulp gulp时基于node.js的,所以安装之前需要保证你安装了node.js.接…

npm使用小结

npm包管理工具使用小结 npm(node package manager)是一个node包管理工具,我们可以方便的从npm服务器下载第三方包到本地使用. 安装: NPM是随同NodeJS一起安装的包管理工具,因此需要安装node.js. 这个可以到nodejs官网下载安装. 如何检测是否安装成功: 在dos命令行中输入npm -v回车,出现版本信息,说明安装成功. 如何使用npm? npm常用命令如下 npm -v 显示npm包管理器的当前版本构建一个新项目时必须要先进行初始化,然后会生成一…

初识gulp

之前一段时间学习使用了gulp自动化构建工具,并在现在使用的项目上部署使用,同时在这做个笔记进行小结,以便加深记忆,如有理解错误的地方请不吝赐教 gulp 的解释我就不多说了这里引用官网的一句话 Gulp.js 是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务,提高开发效率在这我多使用gulp进行JS压缩,css压缩,同时其还能自动化地完成 javascript/coffee/sass/less/html/image/css 等文件的的测试.检查.合并.压缩.格式…

vue—你必须知道的 js数据类型前端学习 CSS 居中事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记（一） web攻击 web安全之XSS JSONP && CORS css 定位 react小结

vue—你必须知道的目录更多总结猛戳这里属性与方法语法计算属性特殊属性 vue 样式绑定 vue事件处理器表单控件绑定父子组件通信过渡效果 vue经验总结 javascript 经验总结更多总结猛戳这里属性与方法不要在实例属性或者回调函数中(例如,vm.$watch('a', newVal => this.myMethod())使用箭头函数.因为箭头函数会绑定父级上下文,所以 this 不会按照预期指向 Vue 实例,然后 this.myMethod 将是未定义.…

[转]gulp排除已压缩文件思路

文章转载至[gulp排除已压缩文件思路] gulp默认排除语法的弊端有个时候我们需要时用gulp排除已经压缩过的js,css等.如果以压缩文件是以".min.js"之类命名规范的还好,如果不是呢?而且还有其他一些场景也会有需要.gulp默认支持glob格式,排除语法为!举几个例子:排除目录 gulp.src([ baseDir + '/**', // Include all '!' + baseDir + '/excl1{,/**}', // Exclude excl1 dir '!…

webpack 性能优化小结

背景如今前端工程化的概念早已经深入人心,选择一款合适的编译和资源管理工具已经成为了所有前端工程中的标配,而在诸多的构建工具中,webpack以其丰富的功能和灵活的配置而深受业内吹捧,逐步取代了grunt和gulp成为大多数前端工程实践中的首选,React,Vue,Angular等诸多知名项目也都相继选用其作为官方构建工具,极受业内追捧.但是,随者工程开发的复杂程度和代码规模不断地增加,webpack暴露出来的各种性能问题也愈发明显,极大的影响着开发过程中的体验. 问题归纳历经了多个web项目…

css写作建议和性能优化小结

1.前言还有几天就到国庆中秋了,快要放假了,先祝大家节日快乐!之前写过js的写作建议和技巧,那么今天就来聊聊css吧!说到css,每一个网页都离不开css,但是对于css,很多开发者的想法就是,css只要能用来布局,把效果图排出来就可以了,其它的细节或者优化,不需要怎么考虑.但是我觉得css可不只是把页面的布局完成就是完事的,还需要考虑很多细节有优化,更不会像大家想得那么简单,在学习当中,如果发现什么技巧或者优化的点,我也会学以致用!那么今天,就分享下我总结的css写作建议和性能优化的一些问题…

构建一个基本的前端自动化开发环境 —— 基于 Gulp 的前端集成解决方案（四）

通过前面几节的准备工作,对于 npm / node / gulp 应该已经有了基本的认识,本节主要介绍如何构建一个基本的前端自动化开发环境. 下面将逐步构建一个可以自动编译 sass 文件.压缩 javascript 文件.多终端多浏览器同步测试的开发环境,并且还可以通过 piblish 命令对项目下的文件进行打包操作. 相关连接导航在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 执行 $Gulp 时发生了什么 —— 基于 Gulp 的前端集成解决方案(二) 常…

常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案（三）

前两篇文章讨论了 Gulp 的安装部署及基本概念,借助于 Gulp 强大的插件生态可以完成很多常见的和不常见的任务.本文主要汇总常用的 Gulp 插件及其基本使用,需要读者对 Gulp 有一个基本的了解.如果你对 Gulp 还不是很了解,可以通过下面两篇文章快速了解 Gulp . 由于几乎所有的插件都有非常友好的使用文档,所以本文不讨论涉及插件使用的东西,仅是一个汇总.排名不分先后. 相关连接导航在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 执行 $Gul…

在windows下安装gulp —— 基于 Gulp 的前端集成解决方案（一）

相关连接导航在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 执行 $Gulp 时发生了什么 —— 基于 Gulp 的前端集成解决方案(二) 常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案(三) 构建一个基本的前端自动化开发环境 —— 基于 Gulp 的前端集成解决方案(四) 一.准备工作 1.什么是 npm? npm 是 nodejs 的包管理工具,主要功能就是管理.更新.搜索.发布node的包.Gulp 就是通过 NPM 安装的.关于 NP…

执行 $Gulp 时发生了什么 —— 基于 Gulp 的前端集成解决方案（二）

前言文章在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 中,已经完成对 gulp 的安装,由于是window环境,文中特意提到了可以通过安装 gitbash 来代替 window 系统的 CMD 命令行工具.本节主要围绕如何使用 Gulp 完成一个预编译 SASS 文件的任务来逐步熟悉 Gulp . 本文地址:http://www.cnblogs.com/leonkao/p/4611102.html 相关连接导航在windows下安装gulp —— 基于…

gulp详细入门教程

本文链接:http://www.ydcss.com/archives/18 gulp详细入门教程简介: gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快的编写代码,而且大大提高我们的工作效率. gulp是基于Nodejs的自动任务运行器, 她能自动化地完成 javascript/coffee/sass/less/html/image/css 等文件的的测试.检查…

从零开始编写自己的C#框架（26）——小结

一直想写个总结,不过实在太忙了,所以一直拖啊拖啊,拖到现在,不过也好,有了这段时间的沉淀,发现自己又有了小小的进步.哈哈...... 原想框架开发的相关开发步骤.文档.代码.功能.部署等都简单的讲过了,就此了结本系列文章,经过这段日子的深入学习,发现本系列文章讲的还是太肤浅了,很多东西都没有讲到,也没有说明白.所以过段时间空闲些了,会继续从理论上来讲解怎么去设计一个框架(也算是给自己定个目标,加加压力),有了前面的代码了解,再学习理论相信大家也更容易接受了. 小结学习如逆水行舟,不进则退,当能…

做一个gulp+webpack+vue的单页应用开发架子

1.目标最近项目上的事情不多,根据我自己的开发习惯,决定开发一些简单的开发架子,方便以后事情多的时候直接套用.本文讲的一个gulp+webpack+vue的单页应用架子,想要达到的目的: 可以通过命令打包开发chunk,并支持热替换可以通过命令打包可发布的chunk 支持路由路由中的代码实现按需加载用CommonJs的风格组织代码代码结构尽量清晰易懂尽我所能先做出一个满足以上特点的架子吧,最近看完ES6,准备再去看看flux和reduce,看过之后再来思考下前端数据如何管理比较科学规…

Python自然语言处理工具小结

Python自然语言处理工具小结作者:白宁超 2016年11月21日21:45:26 目录 [Python NLP]干货!详述Python NLTK下如何使用stanford NLP工具包(1) [Python NLP]Python 自然语言处理工具小结(2) [Python NLP]Python NLTK 走进大秦帝国(3) [Python NLP]Python NLTK获取文本语料和词汇资源(4) [Python NLP]Python NLTK处理原始文本(5) 1 Python 的几个自…

java单向加密算法小结(2)--MD5哈希算法

上一篇文章整理了Base64算法的相关知识,严格来说,Base64只能算是一种编码方式而非加密算法,这一篇要说的MD5,其实也不算是加密算法,而是一种哈希算法,即将目标文本转化为固定长度,不可逆的字符串(消息摘要). 简单了解 MD5(Message Digest Algorithm 5),翻译过来是消息摘要算法第五版,按照惯例,我们推理可能也有MD2,MD3这样名字的历史版本.. 即使完全不了解这个算法的原理,我们也可以从命名中看出一些眉道,所谓摘要,就是一个简短的概括,像我写过的毕业论文,上…

前端自动化构建工具gulp记录

一.安装 1)安装nodejs 通过nodejs的npm安装gulp,插件也可以通过npm安装.windows系统是个.msi工具,只要一直下一步即可,软件会自动在写入环境变量中,这样就能在cmd命令窗口中直接使用node或npm指令.…

gulp初学

原文地址:gulp初学至于gulp与grunt的区别,用过的人都略知一二,总的来说就是2点: 1.gulp的gulpfile.js 配置简单而且更容易阅读和维护.之所以如此,是因为它们的工作方式不同,gulp的流式构建使得gulpfile.js文件写起来并不是像Gruntfile.js一样完成一个个插件的配置那样多.对于这点我的理解还不是很深刻,只能暂时这样做一个比较吧,以后的学习接触多了应该就会深刻的体会到. 2.似乎gulp的上手比grunt更简单一些,或者说一个是轻量级一个是重量级的吧…

gulp批量打包文件并提取公共文件

gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器. browseriyf是模块化打包工具. 一般情况下,Browserify 会把所有的模块打包成单个文件.单个文件在大多数情况下是适用的,可以减少 HTTP 请求数量,提高性能.不过在其他一些情况下,打包的单个文件可能过大,使得页面的初始加载时间过长.这主要是因为单个文件中包含了全部的模块,其中的某些模块使用得很少,或是在页面初始加载的时候不需要,可以在需要的时候再加载.这个时候可以用 Browserify 的插件来创建不同的…