Gulp.js简介 我们讨论了很多关于怎么减少页面体积,提高重网站性能的方法.有些是操作是一劳永逸的,如开启服务器的gzip压缩,使用适当的图片格式,或删除一些不必要的字符.但有一些任务是每次工作都必须反复执行的.如 新图片或修改后图片的压缩 去除调试语句如console,debugger 合并和压缩css和js 把更新的文件部署到服务器 你可能设想大家都会记住所有的这些操作,但总会有人忘记一两条.随着项目越来越大,上面的工作越来越浪费时间.只好设专人来完成这些枯燥的工作. 能不能让这些工作不用…

Grunt 一直是前端领域构建工具(任务运行器或许更准确一些,因为前端构建只是此类工具的一部分用途)的王者,然而它也不是毫无缺陷的,近期风头正劲的 gulp.js 隐隐有取而代之的态势.那么,究竟是什么使得 gulp.js 备受关注呢? Grunt 之殇 gulp.js 的作者 Eric Schoffstall 在他介绍 gulp.js 的 presentation 中总结了 Grunt 的几点不足之处: 插件很难遵守单一责任原则.因为 Grunt 的 API 设计缺憾,使得许多插件不得不负责一…

我们讨论了很多关于怎么减少页面体积,提高重网站性能的方法.有些是操作是一劳永逸的,如开启服务器的gzip压缩,使用适当的图片格式,或删除一些不必要的字符.但有一些任务是每次工作都必须反复执行的.如 新图片或修改后图片的压缩 去除调试语句如console,debugger 合并和压缩css和js 把更新的文件部署到服务器 你可能设想大家都会记住所有的这些操作,但总会有人忘记一两条.随着项目越来越大,上面的工作越来越浪费时间.只好设专人来完成这些枯燥的工作. 能不能让这些工作不用占用人手呢? 你需要…

问题描述: 在之前一直用Koala编译less文件,但本人感觉Koala用起来非常麻烦,好像不能做多个less文件的批量的编译:因为目前项目也没有用到webpack,我的less是通过vs code 里的easy less插件来编译的,然而今天在项目中发现了个比较尴尬的问题,比如我编写了一个公用的base.less文件,里面定义了一些公用的变量.样式,其他.less文件都使用@import引入了base.less文件:接下来问题来了,当我修改了base.less文件后,我其它引入了base.le…

prototype.js简介 2007-11-21 14:22 prototype.js是一个很强大的Javascript函数库,它可以让你很轻松的使用一些特效,实现AJAX的功能.虽然prototype.js是为了Ruby On Rails开发的,它的纯Javascript的性质也使得它很容易用在其他的网络程序中.可惜的是,Prototype.js还没有强大的文档解释,尽管它的代码非常有条理,但是也给初学者造成了一定的麻烦.作者在README里说: Prototype is embarrass…

JS简介 1.JavaScript是个什么东西? 它是个脚本语言,需要有宿主文件,它的宿主文件是HTML文件. 2.它与Java什么关系? 没有什么直接的联系,Java是Sun公司(已被Oracle收购了),JavaScript是netspace(网景公司,已被美国在线收购了),JScript是微软的,90%像JavaScript,一些功能只能在IE上使用. 3.它的用法: 在HTML中位置有三块: (1)head里面 (2)body里面 (3)</html>之后 为了保险起见,一般写在<…

Node.js 简介 Node.js 是什么 Node.js 有着强大而灵活的包管理器(node package manager,npm) 目前, 已经有强大第三方工具模块, 例如数据库连接, 网站开发框架, CSS生成器, 操作系统API, 网络通信 等. Node.js 是什么 ? 是一个让 javascript 运行在服务器端的平台, 以前javascript只能运行在浏览器中,  node.js 可以解析 javascript. CommonJS 试图设计一套Javascript的规范.…

Gulp.js 是一个简单.直观的构建系统.崇尚代码优于配置,使复杂的任务更好管理.通过结合 NodeJS 的数据流的能力,你能够快速构建.通过简单的 API 接口,只需几步就能搭建起自己的自动化项目构建工具. 您可能感兴趣的相关文章 太赞了!超炫的页面切换动画效果[附源码下载] 真是好东西!13种非常动感的页面加载动画效果 你见过吗?9款超炫的复选框(Checkbox)效果 超赞!基于 Bootstrap 的响应式的后台管理模板 创意无限!一组网页边栏过渡动画[附源码下载] 下面是一个简单的代…

Vue.js简介 Vue.js的作者为Evan You(尤雨溪),任职于Google Creative Lab,虽然是Vue是一个个人项目,但在发展前景上个人认为绝不输于Google的AngularJs,下面我会将Vue与Angular(Angular 1.0+版本)做一些简单的比较. Vue的主要特点就和它官网(http://cn.vuejs.org/)所介绍的那样: (1) 简洁 (2) 轻量 (3)快速 (4) 数据驱动 (5) 模块友好 (6) 组件化 简单 下面看一段Angular的实…

此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 API 的介绍与代码实战,以及 React Native 与 iOS.Android 平台的混合开发底层原理讲解与代码实战演示,精选了大量实例代码,方便读者快速学习. 书籍还配套了视频教程「80 节实战课精通 React Native 开发」,此视频课程建议配合书籍学习,书籍中原理性的东西讲解的比较清晰,而…

首先:电脑需要安装 Node.js 一个大绿色的安装按钮,点击就可以. 但还是推荐,点击download选中一款适合电脑配置的版本. Node安装过程,就是下一步 and 下一步~~ 测试手否安装成功: node -v 现在开始安装 gulp.js 全局安装gulp npm install -g gulp 安装好后,把gulp安装到本地 npm install --save-dev gulp 现在可以用安装本地的方法分别把如下插件安装上: 编译Sass (gulp-ruby-sass)与[gul…

在软件开发中使用自动化构建工具的好处是显而易见的.通过工具自动化运行大量单调乏味.重复性的任务,比如图像压缩.文件合并.代码压缩.单元测试等等,可以为开发者节约大量的时间,使我们能够专注于真正重要的.有意义的工作,比如设计业务逻辑,编写代码等等. 对很多前端开发人员而言,Grunt 无疑是这方面的首选.基本上,如果你会用 JavaScript ,那么在一个名为 Gruntfile.js (或者 Gruntfile)的文件中用 Javascript 语言定义自动化任务是非常简单的过程,同时大量的…

Vue.js 五天 汤小洋一. Vue.js简介1. Vue.js是什么Vue.js也称为Vue,读音/vju:/,类似view,错误读音v-u-e 版本:v1.0 v2.0 是一个构建用户界面的框架是一个轻量级MVVM(Model-View-ViewModel)框架,和angular.react类似,其实就是所谓的数据双向绑定数据驱动+组件化的前端开发(核心思想)通过简单的API实现响应式的数据绑定和组合的视图组件更容易上手.小巧 参考:官网 2.vue和angular的区别2.1 angul…

JS 简介 JavaScript 是世界上最流行的编程语言. 这门语言可用于 HTML 和 web,更可广泛用于服务器.PC.笔记本电脑.平板电脑和智能手机等设备. avaScript 是脚本语言 JavaScript 是一种轻量级的编程语言. JavaScript 是可插入 HTML 页面的编程代码. JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行. JavaScript 很容易学习. JavaScript:写入 HTML 输出 document.write("<…

Zepto.js简介 一.总结 一句话总结: Zepto.js语法和jquery起码百分之90相似,主要做移动端框架,和jquery mobile是一个类型的概念 1.Zepto.js做移动端的特点? Zepto有着独特的手指的触摸事件(tap.swipe...),且不再支持IE浏览器 2.移动端常用框架? 1.jQuery Mobile 2.zepto.js 3.bootstrap做适配 二.什么是Zepto.js 转自或参考:什么是Zepto.jshttps://blog.csdn.net/…

The results are then passed to a reporter function that displays the results of the code analysis in the command window—exactly the kind of division of tasks that Gulp.js is built on and that makes it so easy to configure. ---------- 译为:正是这种Gulp.js构建…

在electron中使用sqlite:sql.js简介 在开发electron应用的时候如果想要使用sqlite3,步骤上除了npm安装以外还要rebuild,比较麻烦.如果你想找一个开箱即用的sql库,那么sql.js将是个不错的选择.sql.js是sqlite的Webassembly版,使用上和sqlite基本没有区别. sql.js支持浏览器端直接引入cdn,也支持npm导入. 不过如果用import语句导入的话要注意不推荐直接导入sql.js,这样导入的是sql-wasm.js文件,即W…

环境介绍: pro环境:生产环境,面向外部用户的环境,连接上互联网即可访问的正式环境. pre环境:灰度环境,外部用户可以访问,但是服务器配置相对低,其它和生产一样. test环境:测试环境,外部用户无法访问,专门给测试人员使用的,版本相对稳定. dev环境:开发环境,外部用户无法访问,开发人员使用,版本变动很大. 项目文件的部署 --|src (dev环境 开发环境) --| html --| css --| images --| js --| js (直接写js代码的文件) --| lib(…

前言 今天上推特看见这篇文章,点进去发现是新货. 正好最近想入Node的坑,又有一些Java基础,所以希望翻译出来给大家,同时也让自己加深理解. 才疏学浅,如有不妥之处请指正. 原文链接:Node for Java Developers 这个Node University貌似也提供一些免费的在线课程. 正文 在我举办的Node.js研讨会.开设的课程以及编撰的书之中(尤其是我在线教学的时候),最大的受众便是Java开发者.因为在很久以前,作为一位专业的软件开发人员,你必须得知晓Java这门语言.…

1.安装 Browsersync 和 依赖包 Gulp npm install browser-sync gulp --save-dev 2.gulpfile.js var gulp = require('gulp'), //本地安装gulp所用到的地方 browserSync = require('browser-sync'), //引入模块 //静态服务器 gulp.task('browser-sync', function() {//注册任务 browserSync.init({//调用A…

安装 Node 去 nodejs.org 根据系统选择性按照教程安装Node. 创建项目 创建项目文件夹 进入项目文件夹 初始化项目 使用npm命令:npm init,根据提示完成. 安装 Gulp 进入项目文件夹,使用Node的包管理命令npm进行安装. 全局安装 npm install -g gulp 项目依赖中安装 npm install --save-dev gulp 创建Gulp配置文件 在项目根目录新建配置文件gulpfile.js 设置配置信息 以常见的Gulp插件为例,如下: j…

简介:     Node,是一个可以让 JavaScript 运行在服务器端的平台.它可以让 JavaScript 脱离浏览器的束缚运行在一般的服务器环境下     Node.js 是一个为实时Web( Real-time Web)应用开发而诞生的平台,它从诞生之初就充分 考虑了在实时响应.超大规模数据要求下架构的可扩展性.这使得它摒弃了传统平台依靠多线 程来实现高并发的设计思路,而采用了单线程.异步式I/O.事件驱动式的程序设计模型.这些 特性不仅带来了巨大的性能提升,还减少了多线程程序设计的…

一.安装gulp 1.深入设置任务之前,需先安装gulp: $ npm install gulp -g 2.这会将gulp安装到全域环境下,让你可以存取gulp的CLI.接著,需要在本地端的专案进行安装.cd到你的专案根目录,执行下列指令(请先确定你有package.json档案): $ npm install gulp --save-dev 二.生成文件结构  (生成node_modules文件) 三.创建gulpfile.js文件 var gulp = require('gulp'), ug…

gulp是基于流的前端自动化构建工具. 之前也谈到了 grunt的用法,grunt其实就是配置+配置的形式. 而gulp呢,是基于stream流的形式,也就是前一个函数(工厂)制造出结果,提供后者使用. 同样的,也是包括基本用法和各插件的使用. 一.环境配置 gulp是基于nodejs的,所以没有 nodejs 环境的要先去安装好 然后给系统配上gulp环境 npm install -g gulp 再到某一工程目录下 跟grunt一般,也是需要package.json包依赖文件和一个入口文件 g…

本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. JavaScript简介 Web前端有三层: HTML:从语义的角度,描述页面结构 CSS:从审美的角度,描述样式(美化页面) JavaScript:从交互的角度,描述行为(提升用户体验) JavaScript历史背景介绍 布兰登 • 艾奇(Brendan Eich,1961年-),1995年在网景公司,发明的JavaScript. 一开始JavaScript叫做Liv…

简介 (1)以网络最流行的技术编写原生应用程序的新方法 (2)基于HTML5, CSS3, JS and WebGL而编写 (3)完全支持nodejs所有api及第三方模块 (4)可以使用DOM直接调用nodejs模块 (5)容易打包和分发 (6)支持运行环境包括32位和64位的Window.Linux和Mac OS   使用方法如下: 一.下载nw 1.下载 NW.js(官网:http://nwjs.io/) 这里面normal这个算是运行时吧,sdk那个是一些工具箱,建议都下下来~ http…

引入相对应的文件 let gulp = require("gulp"); let inject = require("gulp-inject"); let cleanCss = require("gulp-clean-css"); let uglify = require("gulp-uglify"); let pump = require("pump"); let cache = require(&quo…

什么是SVG? SVG 指可伸缩矢量图形 (Scalable Vector Graphics) SVG 用来定义用于网络的基于矢量的图形 SVG 使用 XML 格式定义图形 SVG 图像在放大或改变尺寸的情况下其图形质量不会有所损失 SVG 是万维网联盟的标准 SVG 与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体 简介: SVG.js是一个轻量级的JavaScript库,允许你轻松操作SVG和定义动画. SVG(Scalable Vector Graphics,可缩放矢量图形)是基…

一.js 1.javascript简介: 是一门脚本语言(弱类型编程语言)(php是脚本语言) 编程语言如java,先编译后运行 脚本语言不需要编译 作用: 表单验证 页面特效 语法:和Java类似,但是和Java没有关系 组成部分: ECMAScript (语法核心) *DOM(html xml,类似xml的document) BOM(浏览器对象模型) 基本结构(最好放在最后的</body>之上): <script> </script> 2.语法: 输出:docume…

1 全局安装gulp:npm install -g gulp 2 在项目根目录中,安装项目的开发依赖:npm install --save-dev gulp 2.1 根据gulpfile.js中的依赖包,先安装好对应的包.如:npm install --save-dev gulp-uglify 3 在需要构建打包的目录下,新建一个gulpfile.js文件,在该文件中,写上task任务.如下所示: var gulp = require('gulp'); //npm install --save-…